应用 clone() 函数后 jQuery 功能丢失答案

【问题标题】：jQuery functionality lost after applying clone() function应用 clone() 函数后 jQuery 功能丢失
【发布时间】：2017-02-12 21:51:57
【问题描述】：

我正在制作一个包含注册、登录和忘记密码表单的模式，并且我正在通过隐藏和显示它们来玩 div。我这样做trick 在关闭模式时克隆了内容，但里面的元素都没有响应分配给它们的 jQuery。

这是克隆的代码：

var login_modal = $('.md-modal.login-modal');
var originalState = login_modal.clone();

login_modal.find('.md-close').click(function(){
   login_modal.replaceWith(originalState);
});

这是一个克隆后不起作用的代码示例：

$('#email-register').click(function() {
   $('#multi-login-box').hide();
   $('#register-box').show();
});

【问题讨论】：

当克隆克隆在儿子周围浮动时，您必须将其附加到 DOM
阅读.clone()的文档。
我认为login_modal.find('.md-close').click(function(){ 在克隆后也不起作用？由于'.md-close' 是克隆的一部分，因此您应该克隆克隆（originalState），一旦将克隆附加到 DOM，它就不再作为克隆存在......我认为对于您想要实现的目标有更好的方法，但您应该在问题中提供更多详细信息。

标签： javascript jquery dom clone

【解决方案1】：

看到的主要问题是您将处理程序分配给原始元素在克隆它之后。所以克隆不会有这些处理程序边界。（您还需要告诉 .clone 方法您也希望克隆处理程序，但这是假设您在克隆时已经绑定了一些处理程序）

【讨论】：

如何知道处理程序何时被绑定。 OP 在单独的代码块中显示有问题的处理程序。我认为我们不能假设实际代码中的顺序相同。

【解决方案2】：

查看jQuery clone 文档。您可以将 bool 传递给 .clone 以复制处理程序。

编辑：您需要在克隆之前将处理程序附加到原始元素，并执行深度克隆：

login_modal.clone(true, true);

【讨论】：

@RobertParham：你怎么知道的？
@RobertParham 是正确的，因为正在发生克隆，然后处理程序被附加到下一行。 OP 需要翻转那些。
@TylerBurki：再看看这个问题。未被复制的处理程序显示在单独的代码块中。你怎么知道绑定实际发生在哪里？ “下一行”代码不是问题代码。在我看来，这条线是故意克隆后的。根据我们给出的答案，您的答案最接近正确。
@squint 我想我只是用一粒盐来举这个例子，因为其中列出的元素都不存在于问题的第一部分。我假设这只是第一个场景的另一个“例子”。无论如何，我认为这里真正的答案是阅读一些文档。