jQuery链式操作 end()方法返回到上一级

jQuery链式操作 end()方法返回到上一级

转载                     2014年02月20日 11:27:19                

• 标签：

• 2711
                    
• 编辑                     
• 删除                                             

<script type="text/javascript" >
$(function(){
$('input[type="button"]').eq(0).click(function(){
alert('you clicked me!');}).end()
.eq(1).click(function(){
$('input[type="button"]:eq(0)').trigger('click');}).end()
.eq(2).click(function(){
$('input[type="button"]:eq(0)').unbind('click'); }).end()
.eq(3).toggle(function(){
$('.panel').hide('slow');}, function(){ $('.panel').show('slow');};}
</script>

<script type="text/javascript" > 
$(function(){         
$('input[type="button"]').eq(0).click(function(){
alert('you clicked me!');}).end()
.eq(1).click(function(){
$('input[type="button"]:eq(0)').trigger('click');}).end()
.eq(2).click(function(){
$('input[type="button"]:eq(0)').unbind('click'); }).end()
.eq(3).toggle(function(){
$('.panel').hide('slow');}, function(){ $('.panel').show('slow');};} 
</script> 

 

通过end()方法取消当前的jQuery对象，返回前面的jQuery对象。这样当匹配某个按钮时，为其绑定事件处理函数，然后调用end()方法，则又返回前面一个jQuery对象，即按钮集合。

链式代码已经成为jQuery 非常流行的一个特点，在使用链条方式编写代码时，可能会用到eq()、filter()的jQuery方法改变链式方法的对象，但是借助jQuery的end() 方法又能够恢复或最初的jQuery对象，从而可以实现继续执行链式操作。注意，有几个jQuery的方法并不返回jQuery 对象，所以链式操作就不能继续下去，如get() 就不能像eq() 那样使用。