web-dev-qa-db-ja.com

data（）オブジェクトを介したjQueryループ

data()オブジェクトをループすることは可能ですか？

これが私のコードだとしましょう：

_$('#mydiv').data('bar','lorem');  
$('#mydiv').data('foo','ipsum');  
$('#mydiv').data('cam','dolores');
_

これをループするにはどうすればよいですか？これにeach()を使用できますか？

jqueryloopseach
25
bart

jQueryはすべてのデータ情報をjQuery.cache内部変数に格納します。このシンプルだが便利なプラグインを使用して、特定のオブジェクトに関連付けられているすべてのデータを取得できます。

jQuery.fn.allData = function() {
    var intID = jQuery.data(this.get(0));
    return(jQuery.cache[intID]);
};

これを配置すると、これを行うことができます。

$('#myelement').data('test1','yay1')
               .data('test2','yay2')
               .data('test3','yay3');

$.each($('#myelement').allData(), function(key, value) {
    alert(key + "=" + value);
});

あなたはただマットbの提案を使うことができますが、これはあなたが現在持っているものでそれを行う方法です。

15
Paolo Bergantino
$.each($.data(this), function(i, e) {
   alert('name='+ i + ' value=' +e);
});

これは、「this」要素のデータオブジェクトの各プロパティを反復処理します。

19
John Strickler

JQuery 1.4と@ user292614のヒントを使用してテストすると、次のように動作します。

$('#mydiv').data('bar','lorem');  
$('#mydiv').data('foo','ipsum');  
$('#mydiv').data('cam','dolores');

$.each( $('#mydiv').data(),function(i, e) {
   alert('name='+ i + ' value=' +e);
});
10
Mikael Svenson

data()関数で追加されたデータのすべての「キー」を提供する関数はないと思いますが、代わりに、すべてのデータを関数に入れないでください。オブジェクト/マップの下？

このようなもの：

var container = new Object();
container.bar = "lorem";
container.foo = "ipsum";
container.cam = "dolores";
$("mydiv").data("container", container);

そして、あなたがデータを読みたいとき/それを繰り返します：

var blah = $("mydiv").data("container");
for(key in blah) {
    var value = blah[key];
    //do whatever you want with the data, such as:
    console.log("The value of ", key, " is ", value);
}
9
matt b

.data（）を使用する場合、一致する要素に関連付けられた任意のデータを格納するか、一致する要素のセットの最初の要素の名前付きデータストアに値を返します。

ループ内で.data（）の場合、ループ内で同じ方法でアクセスする必要があるので、たとえば（以下）

_<p class="weekday" data-today="monday">Monday</p>
<p class="weekday" data-today="tuesday">Tuesday</p>
<p class="weekday" data-today="wednesday">Wednesday</p>
<p class="weekday" data-today="thursday">Thursday</p>
_

ループ内のhtmlと_data-today_はすべてのタグで同じですが、それらの値は異なるため、基本的にはループ生成htmlなので、同じ方法でアクセスする必要があります。つまり、_js/jQuery_のループ例えば_(below jQuery code)_

$('.weekday').each(function(){ $(this).data('today'); });

_OutPut :_

_Monday
Tuesday
Wednesday
Thursday
_

注：ブラウザコンソールでは、特定の_<DIV>_を返します。

0
Vrushal Raut

私はこれを試しましたが、追加のデータ値が必要でした。この「問題」もある場合は、次のように動作するはずです。

$('#mydiv').data('bar', {name:'lorem', id:'156', price:'199'});

次に、値idで拡張できます

$.each( $('#mydiv').data(),function(i, e) {
   alert('name='+ i + ' name=' +e.name + ' id='e.id + ' price=' + e.price );
});
0
Marthin