Question

我正在学习jquery，我遇到了问题。

这是代码

$(function(){
  var gotProducts=new Array();
  var productsWithDelete=new Array();
  $('.addProducts').on('keyup',function(event) {
    var searchVal=$(this).val().trim();
    if(searchVal.length > 0) {
      $.ajax({
        url: 'http://localhost/url',
        data: { products: $(this).val(), },
        type: 'POST',
        dataType: 'html',
        success: function(msg) {
          $('#printTheProducts').html(msg);
        }
      });
    }
  });

  $('.productsButton').click(function() {
    alert('yes');
  });

});

我从ajax电话中得到的回复是按钮，其中包含 class productsButton 。

现在，当我尝试单击该按钮时，我通过了ajax然后它没有警告是。我的意思是它什么都不做。

的问题： -

可能是什么问题？

Answer 1

使用.on()为生成的按钮尝试事件委派，因为它们是动态生成的

$('#printTheProducts').on('click','.productsButton',function(){
    alert('yes');
});

#printTheProducts是最接近的父元素，您也可以使用document或document.body作为选择器！

语法：

$(closestparentelement).on('event','targetselector',function(){
});

单击jquery时该按钮不执行任何操作

1 个答案: