Question

任何人都可以解释为什么这段代码有效：

$(document).ready(function(){
$("#file").on('change',function(){
$("#selected_files_div").append("<input type='button' class='red_button'>");
$(".red_button").on('click', function(){
// do something
});
});
});

但是这个不起作用？

    $(document).ready(function(){
    $("#file").on('change',function(){
  $("#selected_files_div").append("<input type='button' class='red_button'>");
    });
    $(".red_button").on('click', function(){
    // do something
    });
    });

追加始终有效，但点击事件仅适用于第一种情况

Answer 1

尝试使用Event Delegation绑定点击事件：

$("body").on('click',".red_button", function(){
   // do something
});

在此处阅读更多What is DOM Event delegation?

click函数对动态创建的元素不起作用

1 个答案: