2017-01-07 10 views
-4

私は次の関数が二度呼ばれています:繰り返し機能でユニークなIDを生成する方法は?

function (data) { 
    $.each(data.items, function(i,item) {  
        var $items = $('<div class="col-sm-4 grid-item"><div class="thumbnail"><input type="checkbox" name="thing_'+i+'" value="valuable" id="thing_'+i+'"/><label for="thing_'+i+'"><img class="img-responsive" src="' + item.link + '"></label></div></div>');`enter code here` 

それは、チェックボックスを生成し、私が私に与えて、iと識別子nameforidを生成しています:

thing_1 
thing_2 
thing_3 

問題があるときにI 2回目にこの機能を実行すると、が再び開始され、idsnamefor

+1

String.prototype.concatを使用して、多重回線上の巨大なHTMLの混乱を破った

function (data) { $.each(data.items, function(i, item) { var uniq = uniqueId('thing_'); var $items = $('<div class="col-sm-4 grid-item">'.concat( '<div class="thumbnail">', '<input type="checkbox" name="', uniq, '" value="valuable" id="', uniq, '" />', '<label for="', uniq, '">', '<img class="img-responsive" src="' + item.link + '">', '</label>', '</div>', '</div>')); 

固有の識別子を持っていますか?たいていの場合、それはちょっとしたアンチパターンです。より良い選択肢は、すべての要素に同じ構造体を与え、DOMトラバーサルを使用して必要な関連要素を見つけることです。 –

+0

彼らは私が削除して、名前とIDた場合、一意の識別子 –

+0

あるとしても、ええ、彼らはすべての一意の識別子を持っている必要があります' ' –

答えて

1

使用IIFE

var uniqueId = (function() { 
    var counter = 0; 

    return function(prefix) { 
    counter++; 
    return prefix ? prefix + '' + counter : counter; 
    } 
})(); 

console.log(uniqueId()); // 1 
console.log(uniqueId()); // 2 
console.log(uniqueId('thing_')); // thing_3 
console.log(uniqueId('thing_')); // thing_4 

あなたはこのようなあなたのコードでそれを統合する:彼らはそれぞれに必要です私は

+0

あなたは質問にそのコードを反映するようにそれを精巧にすることができますか? –

関連する問題