javascript - 动态加载的元素 怎么执行对该元素的操作事件 除了在元素上添加onclick之类的属性还有其他方法吗

问题描述

问 题

点按钮2没有不会生效。除了在button元素上添加onclick事件 还有别的办法吗，比如用bind。我对bind不熟
<button id="btn1">按钮1</button>

    <script type="text/javascript">
        $(document).ready(function(){
            $("#btn1").click(function(){
                $("body").append('<button id="btn2">按钮2</button>');
            })
            $("#btn2").click(function(){
                alert("a");
            })
        })
    </script>

解决方案

$(function(){
    $("#btn1").click(function(){
        $('<button>', {
            id: 'btn2',
            text: '按钮2',
            click: function(){
                alert("a");
            }
        }).appendTo("body");
     });
})

1. $(function(){})就是$(document).ready(function(){})的简写，并且是官方推荐的写法。

2. $('body').append('<button>');和$('<button>').appendTo('body');是一个意思，正反而已。

3. $('<button>', {id: 'btn2',click: function(){})和$('<button id="btn2" onclick=""></button>的最终效果近似，但是性能更好，视觉上也更清爽。

4. 别用bind了，都淘汰了，改用on吧。

这篇关于javascript - 动态加载的元素 怎么执行对该元素的操作事件 除了在元素上添加onclick之类的属性还有其他方法吗的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！