如何将jquery函数绑定到动态DOM

Question

我在我的页面上使用jquery文件上传功能，如下所示:

$('.new-variant-image')
 .fileupload({ 
       dataType: 'script',
       add: function(e, data){ 
       }
});

但是DOM类"new-variant-image"是在加载页面后动态创建的，所以它不能工作。我搜索了使用"on"one_answers"live"来绑定动态事件的方法，但在这种情况下无法使其工作。

任何帮助都将非常感谢。

编辑

DOM元素"new-variant-image"是在之后使用AJAX创建的，如果我将代码放在元素创建之后，它就可以工作了。但是我想避免这种情况，因为当我使用ajax多次调用函数时，它会导致浏览器挂起大约2到3秒。

Answer 1

使用函数的回调

$('.new-variant-image').fileupload({
      dataType: 'script',
     add: function(e, data),
     done: $('.new-variant-image').click(function(){
     })
{

Answer 2

您的代码$('.new-variant-image').fileupload({ dataType: 'script', add: function(e, data){应该位于元素创建代码....

我不知道你是如何创建元素(使用ajax或其他东西)…

Answer 3

虽然很晚才回答这个问题，但是从jQuery 1.7开始可以使用jQuery.fn.on.

$(document).on("click", ".new-variant-image", function () {
    $('.new-variant-image')
            .fileupload({
                dataType: 'script',
                add: function (e, data) {
                }
            });
})

为所有当前元素或动态附加的类为new-variant-image的元素附加事件处理函数。