zoukankan      html  css  js  c++  java
  • 关于 jQuery delegate , undelegate

    没啥好说的,看代码吧 !

    jQuery 版本 : 1.71

    浏览器版本:chrome 21

     1 <body>
     2 
     3     <ul class="a-list">
     4         <li><a href="javascript:;">test1</a></li>
     5         <li><a href="javascript:;">test2</a></li>
     6         <li><a href="javascript:;">test3</a></li>
     7         <li><a href="javascript:;">test4</a></li>
     8         <li><a href="javascript:;">test5</a></li>
     9     </ul>
    10 
    11     <ul class="button-list">
    12         <li><button>test1</button></li>
    13         <li><button>test2</button></li>
    14         <li><button>test3</button></li>
    15         <li><button>test4</button></li>
    16         <li><button>test5</button></li>
    17     </ul>
    18 
    19 </body>
    1 //绑定
    2 $(document).delegate('a', 'click', function()
    3 {
    4     alert($(this).html());
    5 });
    1 //不能取消
    2 $(document).undelegate('a');
    3 
    4 //可以取消
    5 $(document).undelegate('a', 'click');
    1 //绑定
    2 $(document).delegate('a, button', 'click', function()
    3 {
    4     alert($(this).html());
    5 });
    1 //不能取消
    2 $(document).undelegate('a', 'click');
    3 
    4 //不能取消
    5 $(document).undelegate('button', 'click');
    6 
    7 //可以取消
    8 $(document).undelegate('a, button', 'click');

    注意:

    1 //不能取消 (与绑定时选择器内容不一致,顺序颠倒)
    2 $(document).undelegate('button, a', 'click');
    3 
    4 //不能取消 (与绑定时选择器内容不一致,少了一个空格)
    5 $(document).undelegate('a,button', 'click');
    1 //绑定
    2 $(document).delegate('a, button', 'click mouseover', function(e)
    3 {
    4     alert($(this).html());
    5 });
     1 //略过部分测试,同上
     2 
     3 //不能取消
     4 $(document).undelegate('a', 'mouseover');
     5 
     6 //可以取消
     7 $(document).undelegate('a, button', 'click');
     8 
     9 //可以取消
    10 $(document).undelegate('a, button', 'mouseover');
    11 
    12 //可以取消
    13 $(document).undelegate('a, button', 'mouseover click');
    1 //绑定
    2 $('.a-list').delegate('a', 'click mouseover', function()
    3 {
    4     alert($(this).html());
    5 });
     1 //略过部分测试,同上
     2     
     3 //不能取消
     4 $(document).undelegate('a', 'click');
     5 
     6 //可以取消
     7 $('.a-list').undelegate('a', 'click');
     8 
     9 //可以取消
    10 $('ul').undelegate('a', 'click');
    11 
    12 //可以取消
    13 $('ul').undelegate();
    14 
    15 //可以取消
    16 $('.a-list').undelegate();
  • 相关阅读:
    【机器学习基础】02、matplotlib基本01
    HIVE学习笔记
    实时数仓项目-01实时模块搭建
    net_framework-EF CodeFirst
    一些前端知识的小记
    .netcore-FreeSql的使用-搭建context
    netcore配置文件与发布
    .netcore与vue的学习笔记001
    .net项目的mvc简单发布
    .net中的SelectList在Html.DropdownList中的使用
  • 原文地址:https://www.cnblogs.com/twoer/p/2704335.html
Copyright © 2011-2022 走看看