0

私はこれを理解しようとしていますが、おそらく単純なものを見落としているだけです。parent1 div は、検索から動的に入力されています。子 div は、2 つの親 div の間に追加できます。私は次のものを持っています：

<div id="parent1">
    <div class="child1">some data</div>
</div>

<div id="parent2">
    <div class="child2">some data</div>
    <div class="child2">more data</div>
    <div class="child2">even more data</div>
</div>

<script type="text/javascript">
$('#parent1 .child1').live('click', function() {
    if($('#parent2 .child2 > "' + $(this) + '").length) {
        alert("exists!");
    }
    else
    { // not exist
        $(this).remove().appendTo('#parent2');
    }
});
</script>

jqueryクリックイベント関数を使用して、parent1からparent2に重複が追加されないようにしようとしています。私は多くのことを試みましたが、常に失敗するだけです。何か案は？

ありがとう、ボブ

4

2 に答える 2

0

まず、.on()overを使用することをお勧めし.live()ます。

私が取っている戦略は非常に単純です: クリック イベントが #parent1 の子 div でトリガーされると、#parent2 の子 div のすべてのコンテンツを反復して検索します。一致が見つかった場合は変数をインクリメントし、何も見つからない場合は何もしません。

検索が完了したら、カウントを評価します。カウントが 1 未満の場合 (つまり一致しない場合)、#parent1 のクリックされた div のテキストをコピーし、#parent2 に追加します。

$(document).ready(function() {
    $(document).on('click', '#parent1 > div', function() {
        var childcontent = $(this).text(),    // Get content in clicked div
            count = 0;                        // Start counter

        // Search through each child in #parent2
        $('#parent2 > div').each(function() {
            var target = $(this).text();
            if(target.search(new RegExp(childcontent, "i")) < 0) {
                // No match found in #parent2
                // Do nothing
            } else {
                // Match is found in #parent2
                count++;
            }
        });

        // Evaluate count, make decision to append
        if(count < 1) {
            $(this).remove().clone().appendTo('#parent2');   
        }
    });
});

これが実際の例です：http://jsfiddle.net/teddyrised/mr2nP/

于 2013-05-31T12:05:40.787 に答える