Question

所以，我的页面上有一些JavaScript函数可以在某些对象发生变化时执行，效果很好。

在我的页面上，我可以通过AJAX / post等添加更多这些对象，这也可以正常工作。

但是，我编写的JavaScript不适用于这些新添加的对象，除非我将JavaScript粘贴在$(document).ajaxStop内。

我已经通过移动代码解决了问题，但是有人可以向我解释为什么会这样，我不知道并且对整个过程都很陌生但我的谷歌搜索并没有真正给我带来解释（可能是我不是在谷歌搜索正确的术语）我想知道我是否应该以最好的方式做到这一点。

我的具体例子是：

$(".subTable").change(function(event){
    $myObj = $(event.target)
    var objID = $myObj.attr('name')
    var objClass =$myObj.attr('class')  
    var objVal = $myObj.val();

    $newObj = $myObj.closest('td').next('td').find('input[type = checkbox]')
    var checkedval = $newObj.is(":checked");

    if((objVal!= "") && (!checkedval)){
        $newObj.click();
    }
    if(objClass=="subField"){
        updateHiddenField(objID)    
    }

  });

这样可以正常工作，直到我添加新对象，然后只有在我将它们放入其中后它们才能正常工作：

$(document).ajaxStop(function () {

});

Answer 1

由于您没有发布任何代码，因此我很难说它与使用click vs on相关：

$('selector').click() - 只有在将事件绑定到dom中时才会对dom中的元素起作用，即它不会对动态添加的元素起作用，除非你在它们之后专门将事件绑定到它们上添加了（可能这就是为什么当你将代码移动到ajaxStop时它起作用的原因）
$('ul').on('click','li', function(){}) - 这将适用于动态添加的元素。请注意，绑定on事件的元素在绑定时必须位于dom中（即，在绑定事件时，'ul'必须位于dom中，但'li'可以是动态的。

Answer 2

当您通过js向页面添加新元素时，这些新添加的元素将不会具有先前附加的事件。因此，只要将元素添加到页面，就应该附加事件。

同样使用jquery，您可以使用.on来附加事件。这也将为新添加的元素附加事件。

为什么我的Javascript不适用于通过AJAX添加的对象

2 个答案: