zoukankan      html  css  js  c++  java
  • 事件委托

    用事件委托写方法在很多时候会提高性能。比如有个ul中有3个li,点击不同的li调用不同的方法,这就可以通过"事件冒泡"(关于事件冒泡)来构建事件委托了。说简单点,就是只写一个方法在ul上,li则冒泡到ul,通过判断不同的事件目标对象(真正点击的是li,也就是目标),执行不同的操作。

    <ul id="weituo">
    <li id="li1">第一个li</li>
    <li id="li2">第二个li</li>
    <li id="li3">第三个li</li>
    </ul>
    <script type="text/javascript">
    function getEvent(event){
    return event ? event : window.event;
    }
    function getTarget(event){
    return event.target || event.srcElement;
    }
    var oUl = document.getElementById('weituo');
    oUl.onclick
    = function(event){
    event
    = getEvent(event);
    var target = getTarget(event);
    switch (target.id){
    case 'li1':
    alert(
    '点击了第一个li');
    break;
    case 'li2':
    alert(
    '点击了第二个li');
    break;
    case 'li3':
    alert(
    '点击了第三个li');
    break;
    default :
    alert(
    '没有了');
    break;
    }
    }
    </script>
  • 相关阅读:
    洛谷P3674 小清新人渣的本愿
    洛谷P3709 大爷的字符串
    CF747F Igor and Interesting Numbers
    洛谷P1494 小Z的袜子
    洛谷P3396 哈希冲突
    分块⑨题
    洛谷P4219 大融合
    bzoj2959 长跑
    洛谷P2486 染色
    洛谷P4382 劈配
  • 原文地址:https://www.cnblogs.com/bianyuan/p/2356214.html
Copyright © 2011-2022 走看看