• 前端_jQuery的.bind()、.live()和.delegate()用法


     $('a').live('click', function() { blah() });  
      $(document).delegate('a', 'click', function() { blah() }); 
      $('a').bind('click', function() { alert("That tickles!") }); 
    
     $('#container').delegate('a', 'click', function() { alert("That tickles!") }); 

    $("#dataTable tbody").on("click", "tr", function(event){  alert($(this).text()); });

    function greet(event) { alert("Hello "+event.data.name); }

    $("button").on("click", { name: "Karl" }, greet);

    $("button").on("click", { name: "Addy" }, greet);

    推荐使用 on()--(jquery1.7版本以上),其次delegate()-, bind()方法和live方法已舍弃;

    最好使用$("#commentForm").on("click", ".addNew", addComment)而不是$("body").on("click", "#commentForm .addNew", addComment)。

     取消表单的提交动作,并且通过返回 false 的方法来防止事件冒泡: $("form").on("submit", false)

     通过使用 .preventDefault(),仅取消默认的动作。 $("form").on("submit", function(event) {  event.preventDefault(); });

    通过使用 .stopPropagation(),防止提交事件的冒泡行为,但是并不禁止提交行为。 $("form").on("submit", function(event) {  event.stopPropagation(); });

    // 糟糕

    $first.click(function(){  $first.css('border','1px solid red');  $first.css('color','blue'); });

    $first.hover(function(){  $first.css('border','1px solid red'); })

    // 建议 $first.on('click',function(){  $first.css('border','1px solid red');  $first.css('color','blue'); })

    $first.on('hover',function(){  $first.css('border','1px solid red'); })

    delegate()要快过其他两种,live()要扫描整个的文档查找所有的$(‘a’)元素,把它们存成jQuery对象。尽管live函数仅需要把’a’作为串参数传递以用做之后的判断,但是$()函数并未知道被链接的方法将会是.live()。

      而另一方面,delegate方法仅需要查找并存储$(document)元素。

      一种寻求避开这一问题的方法是调用在$(document).ready()之外绑定的live,这样它就会立即执行。在这种方式下,其会在DOM获得填充之前运行,因此就不会查找元素或是创建jQuery;

    为了把处理程序附加到可能还未存在于DOM中的DOM元素之上。

    因为bind是直接把处理程序绑定到各个元素上,它不能把处理程序绑定到还未存在于页面中的元素之上。bind()方法不推荐

  • 相关阅读:
    二分法查找数据
    循环队列的操作
    堆栈的操作
    链表的各种操作
    尾插法创建链表
    头插法创建链表
    链表简介
    <map>的常用操作
    linux下php添加自带扩展
    快速排序
  • 原文地址:https://www.cnblogs.com/logep/p/3522111.html
Copyright © 2020-2023  润新知