Jquey(绑定事件)

绑定事件一:属性中绑定(和js第一种绑定方法一样)
<div class="div1" onclick="fun1()">div1</div>
<script>
    function fun1(){
        alert(this.innerHTML);
    }
</script>
绑定事件二:script标签中绑定

<div class="div1">div1</div>
<script>
    $(".div1").click(function(){
        alert(this.innerText);
    })
</script>
绑定事件三:bind      bind绑定的事件对动态添加的标签没有用(点击新添加的li标签不会弹出“123”窗口)
<ul id="ul1">
    <li>111</li>
    <li>222</li>
    <li>333</li>
    <li>444</li>
</ul>
<input type="button" value="+" class="input">
<script>
    $("#ul1 li").bind("click",function(){
        alert(123);
    });
    $(".input").bind("click",function(){
       $("#ul1").append("<li>555</li>");
    });
</script>
绑定事件四:on(有效解决了bind中的问题:动态添加的li标签点击后也能弹出“123”窗口)-->
<ul id="ul1">
    <li>111</li>
    <li>222</li>
    <li>333</li>
    <li>444</li>
</ul>
<input type="button" value="+" class="input">
<script>
    $("#ul1").on("click","li",function(){
        alert(123);
    });
    $(".input").bind("click",function(){
       $("#ul1").append("<li>555</li>");
    });
</script>
</body>
</html>


猜你喜欢

转载自www.cnblogs.com/gaoyukun/p/9011005.html
今日推荐