zoukankan      html  css  js  c++  java
  • jQuery 事件委派

    /******************************************************************/

    $(function(){
    //live()事件委派,后续添加的li节点也会有与兄弟一样的事件设置
    $('li').live('click',function(){
    alert($(this).html());
    });
    });
    function add(){
    $('ul').append('<li>赵</li>');//添加后赵这个元素同样具有了click属性
    }

    <h2>jquery事件委派</h2>
    <ul>
    <li>刘</li>
    <li>关</li>
    <li>张</li>
    </ul>
    <input type="button" value="添加" onclick="add()">

    /******************************************************************/

     事件对象、阻止浏览器默认动作、阻止事件冒泡

    $().bind(‘click’,function(evt){ window.event });

    $().click(function(evt){});

    $().bind(‘mouseover’,f1);

    function f1(evt){}

    事件对象:就使用红色的evt即可,在jquery框架内部有做浏览器兼容处理。

    阻止浏览器默认动作、阻止事件冒泡:

           dom2级浏览器默认动作阻止:

                  事件对象.preventDefault();    主流浏览器

                  事件对象.returnValue = false;   IE浏览器

           dom2级事件冒泡阻止:

                  事件对象.stopPropagation();    主流浏览器

                  事件对象.cancelBubule = true;   IE浏览器

          

    在jquery里边:

           $().bind(‘click’,function(evt){

                  evt.preventDefault();

                  evt.stopPropagation();

           });

           preventDefault()方法是jquery的方法,名字与js底层代码的名字一致而已。

                        并且其有做浏览器兼容处理

           stopPropagation()方法是jquery的方法,名字与js底层代码的名字一致。

                              其有做浏览器兼容处理

  • 相关阅读:
    最优匹配问题
    树的最大独立集
    koa2学习(一)
    vue源码阅读(一)
    一直以为错的一个问题,记录一下
    关于 vuex 的使用忠告
    《javascript设计模式与开发实践》--- (单一职责原则)
    心累
    node 学习(二)
    node 学习(一)
  • 原文地址:https://www.cnblogs.com/yd09023/p/5872736.html
Copyright © 2011-2022 走看看