の収集はここ

Question

ループ私のコード（私はジャンプの後であるにこだわっているものを）

<script language="JavaScript" type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script> 
<script type="text/javascript"> 
var countThisMany = 4; //how many data-id's I want to count per "section" of images 
var finalString = ""; //blank var to be used later, must be defined here. 
</script> 

<img src="foo.jpg" data-id="id1" data-item="1" /> // just a bunch 
<img src="foo.jpg" data-id="id2" data-item="2" /> // of images with 
<img src="foo.jpg" data-id="id3" data-item="3" /> // data-* usage to 
<img src="foo.jpg" data-id="id4" data-item="4" /> // store two bits 
<img src="foo.jpg" data-id="id5" data-item="5" /> // of information 
<img src="foo.jpg" data-id="id6" data-item="6" /> // that I'll need 
<img src="foo.jpg" data-id="id7" data-item="7" /> // to extract 
<img src="foo.jpg" data-id="id8" data-item="8" /> // later on below. 

<img src="bar.jpg" data-id="id9" data-item="1" /> // another set of images 
<img src="bar.jpg" data-id="id10" data-item="2" /> 
<img src="bar.jpg" data-id="id11" data-item="3" /> 
<img src="bar.jpg" data-id="id12" data-item="4" /> 
<img src="bar.jpg" data-id="id13" data-item="5" /> 
<img src="bar.jpg" data-id="id14" data-item="6" /> 
<img src="bar.jpg" data-id="id15" data-item="7" /> 
<img src="bar.jpg" data-id="id16" data-item="8" /> 

<script type="text/javascript"> 
var item_array = $("img").map(function() { 
    return $(this).attr("data-item"); 
}).get(); 

//alert(item_array); 
//returns "1,2,3,4,5,6,7,8,1,2,3,4,5,6,7,8" 


var id_array = $("img").map(function() { 
    return $(this).attr("data-id"); 
}).get(); 
//alert(id_array); 
//returns "id1,id2,id3,id4,id5,id6,id7,id8,id9,id10,id11,id12,id13,id14,id15,id16" 


for (i=0;i<countThisMany;i++){ 
finalString=finalString+id_array[i]+';'; 
} 

//alert(finalString); 
//returns "id1;id2;id3;id4" -- could be more or less if "countThisMany" is changed to something other than 4 

</script> 

このコード全体だFORとjQueryを介してデータをセグメント化すると、自己完結しているので、HTMLとして保存すること自由に感じ、アラートのコメントを外して結果を確認します。

しかし私が必要とするのは、さらに進歩です。私はdata-item変数countThisMany

以下であるので、finalStringの最終結果は「ID1だろうimgタグのdata-id収集したいと思い、ID2、ID3、ID4; ID9、ID10、ID11; id12 "となる。そしてcountThisManyは、例えば、2に変更された場合、それは次のようになり、「ID1、ID2、ID9、ID10」

私はとても近いですが、私は最初のを収集する方法を見つけ出すことはできませんかのように私は感じます第1の8個の画像のうちの4個、第2の8個の画像の第1の4個を含む。繰り返しますが、イメージの総量とキャプチャする必要のある数は変わりますので、 "countThisMany 'var。

これはすばらしいstackoverflowコミュニティへの私の最初の投稿ですので、私は興奮しています！時間の！

Answer 1

使用filter方法

var item_array = $("img").filter(function() { 
    return parseInt($(this).data("item")) <= countThisMany; 
}).map(function() { 
    return $(this).data('id'); 
}).get(); 

Answer 2

var countThisMany = 4; 
var item_array = $("img") 
    .filter(function() { 
     return parseFloat($(this).attr("data-item")) <= countThisMany; 
    }) 
    .map(function() { 
     return $(this).attr("data-id"); 
    }) 
    .toArray(); /* instead of get() */ 

これは配列を返すことに注意してください。あなたはその結果に.join(',')を呼び出すこともできますので、文字列をしたいように見える。

Answer 3

$.mapと組み合わせて$.grepを使用してください。ループではなく配列にjoinを追加しました。フィドル：http://jsfiddle.net/brentmn/5yNbE/5/

var countThisMany = 2; 
var finalString = ""; 

var id_array = $.grep($('img'), function(item) { 
    return ($(item).data('item') <= countThisMany); 
}).map(function(item) { 
    return $(item).data('id') 
}); 

finalString = id_array.join(';');