javascript - 如何在 JavaScript 中克隆表单并保留事件绑定(bind)

Question

我即将克隆表单的一部分，其中有一些操作绑定(bind)到click事件。我想将属性中出现的所有单词 TEMPLATE 更改为 'n_'+ID。我想从克隆部分的结构中进行抽象 - 它将是一个 TEMPLATE 或 10 个。我尝试过类似的操作，但绑定(bind)丢失了:

insert = function(){
    var old = $('#TEMPLATE');
    var copy = old.clone(true); 
    var html = old.html().replace(/TEMPLATE/g,'n'+next_ID);
    old.html(html);
    old.attr('id','n'+next_ID);
    old.show('fast');
    old.after(copy);
    next_ID++;
}

有什么方法可以在不了解复制元素的结构的情况下轻松完成此操作。

Answer 1

没有。您每次都必须重新添加处理程序。

如果您确实想避免这种情况，请使用事件委托(delegate)( delegate() 或 live() )来附加事件处理程序。这样，它们在事件触发时不与特定节点对象相关联，而仅与元素的放置相关联，无论它们是否与选择器匹配。

$(myform).delegate('.dosomething', 'click', function() {
    // handle clicks on any .dosomething in the form now or added later
});

(并尽量避免对 html()/innerHTML 进行文本处理。这是不可靠的。最好迭代您想要更改其名称或类的对象使用 attr 执行此操作。)