Question

我正在使用Jeditable JQuery插件对位置进行编辑更改。这适用于页面上的现有列表项。

$('.edit').editable('http://localhost:8080/EditInPlace/Editable', {
    event     : "dblclick",
    callback : function(value, settings) {
        $(".dropdown dt a span").html(value);
        $("#result").html("Selected value is: " + getSelectedValue());
    }
});

但是，我在页面上动态添加列表项，这些项不响应事件处理程序。我假设我需要使用委托事件，就像我用于click事件一样。

$(document).on("click",".edit",function(e){
    alert("click!");
});

我无法弄清楚如何将Jeditable处理程序添加到委托事件中。有什么建议吗？

Answer 1

委派方法适用于事件。您可以创建一个自定义事件，但为了保持简单，现在只需在每次添加需要它的新元素时调用您的插件。

这可以是ajax成功回调，也可以是在代码中调用任何插入方法，例如append()或html()。

为了保持代码更精简，你可以做的几件事就是将插件的选项对象存储在一个变量中，这样你就不必每次都创建它们，或者创建包含大量插件调用的函数。

示例：

var edit={ 
       url: 'http://localhost:8080/EditInPlace/Editable',
       opts:{
            event     : "dblclick",
            callback : function(value, settings) {
                 $(".dropdown dt a span").html(value);
                $("#result").html("Selected value is: " + getSelectedValue());
        }
    }
};

$(selector).append( newContentString).find('.editClass').pluginName(edit.url, edit.opts)

可编辑的动态元素

1 个答案: