jquery - jQueryUIProgressBar-HTML属性と等しい値の設定

Question

同じクラスで、jQueryのスニペットを1つだけ使用して、複数のプログレスバーを初期化しようとしています。値をHTML属性「value」に設定したい。

これがhtmlです：

<div class="pop" value="98"></div>
<div class="pop" value="85"></div>
<div class="pop" value="78"></div>
<div class="pop" value="54"></div>

そして、これが私がうまくいくと思ったjQueryです：

$( ".pop" ).progressbar({
value: parseInt($(this).attr("value"))
});

しかし、そうではありませんでした。プログレスバーが表示されますが、値が0のように見えます。

次のように変更した場合：

$( ".pop" ).progressbar({
value: parseInt($(".pop").attr("value"))
});

次に、それらはすべて正常に初期化されますが、すべての値は最初のHTML要素の値に設定されます（この例では、すべて98に設定されます）。私はこれを期待していました。

それで、とにかくこれを行うことはありますか？

score 5 · Accepted Answer

jQuery.each関数を使用します。次に例を示します。

$.each($(".pop"), function() {
    $(this).progressbar({ value: parseInt($(this).attr("value")) });
});

別の例：

$(".pop").each(function() {
    $(this).progressbar({ value: parseInt($(this).attr("value")) });
});

score 1 · Accepted Answer

最初の例では、そのコンテキストのWindowオブジェクトの$(this)ように何も提供されないため、各divをループして、正しい「value」属性を取得していることを確認します。this

$('.pop').each(function(index) {
    $(this).progressbar({
        value: parseInt($(this).attr("value"))
    });      
});

score -2 · Accepted Answer

value属性を設定する必要があります。

var progressBar = $('#progressBar');
var v = 70;
progressBar.arrt('value', v);

3 に答える 3