网络编程
位置:首页>> 网络编程>> JavaScript>> jQuery 1.3.3 新功能[译]

jQuery 1.3.3 新功能[译]

作者:cloudream 来源:随想飞翔 发布时间:2009-06-04 12:23:00 

标签:JavaScript,库,jquery,功能

增强的toggleClass()

1.toggleClass也可以和addClass一样,用空格分隔多个class名称了。

.toggleClass("a b") == .toggleClass("a").toggleClass("b")

2.无参数时,自动删除、恢复全部class,也可以传递一个布尔值,true为恢复class,false为删除class。

3.也可以第一个参数为class名,第二个参数为布尔值,具体用法如下。


// 原始代码
// <div class="a b c"></div>

// 删除、恢复全部class
$('div').toggleClass();        // <div class="" />
$('div').toggleClass();        // <div class="a b c" />
$('div').toggleClass( false ); // <div class="" />
$('div').toggleClass( true );  // <div class="a b c" />

// 删除、恢复多个 class
$('div').toggleClass( "a b" );          // <div class="c" />
$('div').toggleClass( "a c" );          // <div class="a" />
$('div').toggleClass( "a b c", false ); // <div class="" />
$('div').toggleClass( "a b c", true );  // <div class="a b c" />

简化的hover()

1.3.3中,hover绑定事件可仅传递一个函数,将默认用做mouseenter/mouseleave公用的函数。

旧代码:


$('li').hover(function() {
        $(this).addClass('test');
}, function() {
        $(this).removeClass('test');
});

新代码:


$('li').hover(function() {
        $(this).toggleClass('test');
});

live冒泡事件支持预设参数

// 预设参数
var eventConfig = {
    selectedClass: "selected"
};

$("li").live("click", eventConfig, function( event ) {
    // 绑定函数的参数event的data属性即为传递的预设参数
    var selectedClass = event.data.selectedClass;
});

更好的支持其它windows、document对象

通过.contents()获得其它框架的document对象。

var iframeDoc = $('iframe').contents().get(0);

这样就可以获取其height/width/CSS属性或绑定事件。

// 获得框架宽度
$(iframeDoc).width();

// 获得框架高度
$(iframeDoc).height();

// 绑定事件
$(iframeDoc).bind('click', function( event ) {
    // do something
});

// 获得CSS属性值
$('div', iframeDoc).css('backgroundColor');

注意,如果要处理框架内部网页元素,请使用此插件(配合jQuery 1.3.3/+),和以下语法:

$('iframe').win().bind('load', fn);
$('iframe').doc().find('a').click(fn);

增强的index()

两个变化,第一个,支持传递selector作为参数。

旧代码:

$("img").index( $("img.selected") );

新代码

$("img").index( ".selected" );

第二个,无参数传递,直接查找在同级元素中的位置。

旧代码:


var $this = $(".selected");

$this.parent().children().index( $this );

新代码:

$(".selected").parent().index();

自行指定this对象

在1.3.3中,可以在bind/live绑定事件时,自行指定this参数代表的对象。这个用法需求不多,而且可用event.target,event.currentTarget代替。

具体用法请参看原文

0
投稿

猜你喜欢

  • 作者:Dmitry @ Usability Post  版权所有 Copyright.译者:明月星光 @ UCD翻译小组原文:ht
  • 什么是品牌的视觉传达品牌,这个熟悉而又陌生的名词,有时总会让人产生误解。品牌很广,广到一个意会颇深的战略发展理念;品牌很小,小到一个清晰可见
  • 负责为网页编程语言提供标准化服务的W3C组织(World Wide Web Consortium)近日开始修改超文本标记语言的定义,计划为该
  • 秦歌这篇文章总结得很不错,俺挑刺来啦:1. 优先级的描述不严谨,有 !important 时,网页样式可以覆盖用户自定义样式。用户!impo
  • 例如:文本abcaBcabCaBCabcaBCa,关键字bc,在不区分大小写的情况,一共有6个匹配项。 则在网页中显示的是abcaBcabC
  • MacJi “偷懒”翻译了部分,下午冒着被 BOSS 开除的危险将其补完(原文链接)。使用 line-height 垂直居中line-hei
  • 因工作需要,要将存放在sql server数据库中的数据全部导入到mysql数据库中,在网上搜集相关资料,找到两种方法,现在分别谈谈对他们的
  • 我在初学时查阅过大量相关资料,发现其中提供的很多方法实际操作起来并不是那么回事。对于简单的应用,这些资料也许是有帮助的,但仅限于此,因为它们
  • 如何阻止别人非法链接你网站的图片,防盗链?getimage.asp<% Option ExplicitDim&nb
  • 代码如下:<% Function Bytes2bStr(vin,cSet) Dim BytesStream,StringReturn
  • 这个程序将记数器的数字放在ACCESS数据库中,当然你也能用你希望其它的ODBC数据源.这个程序从URL中读取记数信息.如下:< IM
  • 在这篇文章(不敢妄称教程,最多称之为学习笔记)里,我会从头开始实现客户端模板的效果。不过你不要期望能够在这里找到可以直接拿去使用直接复用灵活
  • 技巧之一:提高使用Request集合的效率 访问一个ASP集合来提取一个值是费时的、占用计算资源的过程。因为这个操作包含了一系列对相关集合的
  • 这次我们来说一些很小的东西,相当小。不过先说一个故事:这天晚上,你打算出去下一次馆子,就行动了,找到了一家新开的小店进去坐了下来,服务员很殷
  •  <%dim total(7,1) total(1,0)="中国经营报" 
  • 就我个人经验来讲:除了oracle,没有比HP 客户支持中心更糟糕的体验了。刚买不到一个月的HP MINI笔记本,莫名其妙键盘上的引号键松动
  • 至于对好广告的评判,不同的人有不同的标准,一些人认为那些打动人、有新意、有共鸣的广告是好广告,另一些人的观点则是:观众喜欢与否,不是广告好与
  • 基础知识-----黄金分割法960px宽度的网格设计的好处无需我多说了,下面主要是复习一下如何作图求出960px宽度下的黄金分割点1、首先沿
  •        php遍历目录和文件的场景在很多时候都能用到,遍历目录方法的方法有好几种,那么应该使用
  • 文件名字处理文件名字得看业务要求。不需要保留原始名字,则随机生成名字,拼接上白名单校验过的后缀即可。反之要谨慎处理://允许上传的后缀白名单
手机版 网络编程 asp之家 www.aspxhome.com