Question

采用以下示例：

$.fn.foo = function() {

    var $input = $('<input type="text"/>');
    var $button_one = $('<button>One</button>');
    var $button_two = $('<button>Two</button>');

    $button_one.click(function(){
        $input.val('hey');
    });

    $button_two.click(function(){
        $input.replaceWith( $input.val('').clone( true ) );
    });

    this.append( $input, $button_one, $button_two );


};

查看演示：http://jsbin.com/ezexah/1/edit

现在点击“一个”，你应该在输入中看到“嘿”。然后单击“两个”，然后再次单击“一个”，它不起作用。即使使用true中的clone选项复制所有事件，它仍然无效。有什么想法吗？

Answer 1

您没有更新$input。它仍然指的是您刚删除的元素，这意味着$input.val('hey');将更新现在与DOM树分离的DOM元素的值。
.clone或.replaceWith不会自动更新现有引用：

var $clone = $input.val('').clone( true )
$input.replaceWith($clone);
$input = $clone;

这与true选项btw无关，因为您没有将任何事件处理程序绑定到$input。

DEMO

jQuery clone（true）不使用动态元素

1 个答案: