0

私はjqueryを使ってUIをやっています。問題は、内部に追加と削除のボタンがあるコンテナーを作成したことです。

をクリックするaddと、別の div に一度だけ追加されます。

追加された div をクリックするremoveと削除され、イベント ハンドラーが削除されたかのように別の div に再度追加できます。

.unbind を試しましたが、私のコードでは機能しません。

ここで私のコードを手伝ってください：

http://jsfiddle.net/8mNKN/

$(".more").one("click",function(e) {

        $(this).parent().clone().appendTo("#we");

    });

    $(document).on("click","#we .remove",function() {
        $('.more').unbind('click.MyNamespace');
        $(this).parent(".container").remove();
    });

<div class="container">
    <p>There are 0 boxes</p>

    <a href="#" class="more">Add more +</a>
    <a href="#" class="remove">Add more +</a>
</div>
<br/>
<div class="container">
    <p>There are 0 boxes</p>

    <a href="#" class="more">Add more +</a>
    <a href="#" class="remove">Remove -</a>
</div>
<br/>
<div class="container">
    <p>There are 0 boxes</p>

    <a href="#" class="more">Add more +</a>
    <a href="#" class="remove">Remove -</a>
</div>
<br/>
<div id="we">
</div>
4

1 に答える 1

0

私があなたの要求を正しく理解していれば、

$(".more").on("click",function(e) {
    var ct = $(this).closest(".container");
    if(ct.data('cloned')){
        return;
    }
    ct.clone().appendTo("#we").data('source', ct);
    ct.data('cloned', true);
});

$(document).on("click","#we .remove",function() {
    var ct = $(this).closest(".container");
    ct.data('source').data('cloned', false)
    ct.remove();
});

デモ:フィドル

于 2013-07-12T08:29:29.453 に答える