javascript - JQueryで子divのIDを自動生成する方法

Question

JQuery で子 div の ID を自動生成する方法。問題を解決できるように助けてください。

これらのIDを設定したいHTMLコードがあるので、これらに操作を適用できます。

<div id="main">

<div class="child"></div>
<div class="child"></div>
<div class="child"></div>
<div class="child"></div>
<div class="child"></div>
</div>

これに合わせたい。+ をクリックすると完全な div で最大になり、それ以下の場合は再び同じ位置にあるはずです。

Answer 1

新しい div を作成してそれに割り当てようとすると、考えられる解決策の 1 つが次のようになります。

<div id="parent">

</div>

for(var i = 0; i< 10; i++) { // suppose I append 10 divs to parent
  $('#parent')
        .append('<div id="myid_'+ i +'">child'+ i +'</div>');
}

デモ

divただし、親内にすでに子がある場合は、

<div id="parent">
  <div>child 1</div>
  <div>child 2</div>
  <div>child 3</div>
</div>

次に、1つの可能なアプローチは

$('#parent div').each(function(i) {
   $(this).attr('id', 'myid_' + i);
});

編集によると

<div id="main">
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
</div>

 $('#main .child').each(function(i) {
    $(this).attr('id', 'myid_' + i);
 });

デモ

別のアプローチは

$('#main .child').attr('id', function(i) {
   return 'myid_' + i;
});

デモ

Answer 2

live()呼び出しはreadyイベントをサポートしていないため、自動的に行う方法はありません

Answer 3

idおよびその他の情報を配列内のハッシュから取得する場合は、新しい div を作成して値を割り当てるためのコード パラドックスの応答に続きます。

arry = [{name: name1, addr: addr1, id: id1}, {name: name2, addr: addr2, id: id2}, etc...]

<div id="parent">
</div>

for(var i = 0, l = arry.length; i < l; i++) {
  var obj = arry[i]
  name = obj.name
  pid = obj.pid
  addr = obj.addr
  $('#parent').append('<div id=' + pid + '>' + name + ': ' + addr + '</div>');
};

Answer 4

child-1これにより、などの子 div の ID が与えられchild-2ます... child-n

$(function(){

   var childDivs=$("#main div");
   for(var i=0;i<childDivs.length;i++)
   {  
      $(childDivs[i]).attr("id","child-"+i);
   }        

});

例 : http://jsfiddle.net/nsQcR/12/ (ビュー ソースをチェックして ID を確認できます);