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

【问题标题】：Why does my Javascript not work on objects added via AJAX为什么我的 Javascript 不适用于通过 AJAX 添加的对象
【发布时间】：2014-02-12 11:40:27
【问题描述】：

所以，当某些对象发生变化时，我的页面上有一些 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 () {

});

【问题讨论】：

你能显示代码吗？
你说的是哪个javascript代码？请注意，例如，处理程序绑定到 DOM 中已经存在的元素。您仍然可以将事件委托给最近的静态容器
对不起，我没有意识到代码在这种情况下会有这么大的帮助，因为我认为这个问题很笼统。 @fatman 设法猜到了我的困境（我不知道 javascript 中的“on”，所以现在将重构我的代码以使用它）干杯！

标签： javascript jquery ajax post

【解决方案1】：

由于您没有发布任何代码，这真的很难说，但我可以猜到它与使用 click 与 on 有关：

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

【讨论】：

谢谢你的猜测是正确的，在这个具体的例子中它是“改变”，但我猜这和“点击”是一样的，所以需要同样的事情。感谢您的解释，我将去更新我的代码！ :)
你是对的，所有的辅助方法都是一样的。

【解决方案2】：

当你通过 js 向页面添加新元素时，这些新添加的元素不会有之前附加的事件。因此，您应该在将元素添加到页面后立即附加该事件。

还可以使用 jquery 来附加事件。这也会为新添加的元素附加事件。

【讨论】：