web-dev-qa-db-ja.com

子divを介したjQueryループ

<div id="ChosenCategory" class="chosen">
   <div class="cat_ch" name="1">
   <div class="cat_ch" name="2">
   <div class="cat_ch" name="3">
   <div class="cat_ch" name="5">
   <div class="clear"> </div>
</div>

ループしたいdiv.cat_ch どうやって?

これは失敗します:

    $("div").each(function () {
       alert("FW");
       alert($(this).attr("name").val());
    });
8
levi

http://jsfiddle.net/2TRxh/

あなたの問題は、属性$(this).attr("name").val()を取得した後、divからvalを取得しようとすることにあると思います。 divで.val()を使用しても意味がありません。それを削除すると、$(this).attr("name")はdivからnameプロパティを返します。 divだけでなく、それぞれのクラスセレクターを使用して、ループするdivをさらに指定できます。 $(".cat_ch").each(function () {});これは、この質問に対する他のさまざまな回答で示されています。

4
scrappedcola
$('#ChosenCategory').children('.cat_ch').each(function() {

});

または

$('#ChosenCategory > .cat_ch').each(function() {

});

JQueryの.childrenメソッドとcss3子セレクター>は、セレクター、例ではクラス.cat_chに一致する直接の子のみを返します。

DOMツリーをさらに深く検索する場合、つまりネストされた要素を含める場合は、.findを使用するか、子セレクターを省略します。

$('#ChosenCategory').find('.cat_ch').each( function(){} )

または

$('#ChosenCategory .cat_ch').each( function(){} )
12
Ortiga
$(function(){

    var items=$(".cat_ch")
     $.each(items,function (index,item) {

       alert($(item).attr("name"));
    });

});

作業サンプル: http://jsfiddle.net/GzKHA/

5
Shyju

内部のDivのみをターゲットにする場合は、

$('#ChosenCategory div').each( function() {...} );

他の回答には特定のクラスが必要であるか、親div内の非divも処理されます。

4
tigertrussell
 function loopOver(obj)
 {
 var chl = obj.firstChild; 
 while(chl)
 {
 if( chl.nodeType == 1)
 {
 var isAttr = chl.getAttribute( 'name'); 
 if(isAttr)
 {
 alert(isAttr); 
} 
} 
 chl = chl.nextSibling; 
} 
} 
 
 //これは実行速度の点ではるかに高速です!!! 
 var obj = document.getElementById( "ChosenCategory"); 
 loopOver(obj); 
 
Make sure to enclose the each `<div>` tag at the end of each!!
2
spaceman12
$('.cat_ch').each(function(i, e) {
    alert('FW');
    alert(e.attr('name').val());
});
1
BlackSpy
$(".cat_ch").each(function () {
       alert("FW");
       alert($(this).attr("name").val());
    });
1
Marcus

_div.cat_ch_をループする場合は、jQueryセレクターに使用する必要があります。

_$("div.cat_ch").each(function () {
   alert("FW");
   alert($(this).attr("name").val());
});
_

JQuery children()メソッドを使用して、子要素をループすることもできます。

_$("#ChosenCategory").children().each(function () {
   alert("FW");
   alert($(this).attr("name").val());
});
_

目的の要素をループする3番目の方法は、次のようになります。

_$("#ChosenCategory > div").each(function () {
   alert("FW");
   alert($(this).attr("name").val());
});
_

どちらの方法でも使用できますが、最善の方法はありません。

1
jeff