50个比较实用jQuery代码段

2020-05-19 07:42:20易采站长站整理

//切换(toggle)类允许你根据某个类的
//是否存在来添加或是删除该类。
//这种情况下有些开发者使用:
a.hasClass('blueButton') ? a.removeClass('blueButton') : a.addClass('blueButton');
//toggleClass允许你使用下面的语句来很容易地做到这一点
a.toggleClass('blueButton');

7. 如何设置IE特有的功能:


if ($.browser.msie) {
// Internet Explorer就是个虐待狂
}

8. 如何使用jQuery来代替一个元素:


$('#thatdiv').replaceWith('fnuh');

9. 如何验证某个元素是否为空:


if ($('#keks').html() == null) {
//什么都没有找到;
}

10. 如何从一个未排序的集合中找出某个元素的索引号


$("ul > li").click(function () {
var index = $(this).prevAll().length;
});

11. 如何把函数绑定到事件上:


$('#foo').bind('click', function() {
alert('User clicked on "foo."');
});

12. 如何追加或是添加html到元素中:


$('#lal').append('sometext');

13. 在创建元素时,如何使用对象字面量(literal)来定义属性


var e = $("", { href: "#", class: "a-class another-class", title: "..." });

14. 如何使用多个属性来进行过滤


//在使用许多相类似的有着不同类型的input元素时,
//这种基于精确度的方法很有用
var elements = $('#someid input[type=sometype][value=somevalue]').get();

15. 如何使用jQuery来预加载图像:


jQuery.preloadImages = function() {
for(var i = 0; i < arguments.length; i++) {
$("<img />").attr('src', arguments[i]);
}
};
//用法
$.preloadImages('image1.gif', '/path/to/image2.png', 'some/image3.jpg');

16. 如何为任何与选择器相匹配的元素设置事件处理程序:


$('button.someClass').live('click', someFunction);
//注意,在jQuery 1.4.2中,delegate和undelegate选项
//被引入代替live,因为它们提供了更好的上下文支持
//例如,就table来说,以前你会用
//.live()
$("table").each(function(){
$("td", this).live("hover", function(){
$(this).toggleClass("hover");
});
});
//现在用
$("table").delegate("td", "hover", function(){