Loading

jQuery中bind()与on()绑定事件的区别

案例：

<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>

    <script>
        $("ul li").bind('click', function() {
            alert("boom!");
        });
        // $("ul li").on('click', function() {
        //     alert("boom!");
        // });
        // 和上面效果一样
        $("ul").append("<li>5</li>");
    </script>
</body>

此时点击列表5并不会弹出消息框

给.on()添加selector参数li:

<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
    </ul>

    <script>
        $("ul").bind('click','li', function() {
            alert("boom!");
        });
        $("ul").append("<li>5</li>");
    </script>
</body>

此时点击列表5弹出消息框boom!

posted @ 2020-01-29 16:22  阿dun  阅读(875)  评论(0)  编辑  收藏  举报