.on()不能处理动态添加的元素

Question

我有以下代码：

jQuery(function($){
   $( '.comment-form' ).submit(function(){
      // do stuff
   });
});

当这个元素是动态添加的时候，我想以它为目标。所以我使用：

jQuery(function($){
   $(document).on('submit', '.comment-form',function(){
      // do stuff
   });
});

但是当动态创建元素时，事件触发器永远不会被添加。以下内容是否存在问题：

$(document).on('submit', '.comment-form',function(){

据我所知，这是正确的。

Answer 1

试试看

​

jQuery(function($){
   $(body).on('submit', '.comment-form',function(){
      // do stuff
   });
});

​

Answer 2

选中此选项，并根据需要更新代码

​

$(".add_new").click(function(){
  $(".form_area").html('<form class="main_form"><input type="submit" value="submit"></form>');
});
$(document).on('submit','.main_form',function(){
  alert('Form submit');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div><button class="add_new"> Add New Form </button></div>
<div class="form_area">
  <!--For dynamic added content-->
</div>

​