jQuery UI ProgressBar - 设置值等于HTML属性

Question

我正在尝试使用一个jQuery片段在同一个类下初始化多个Progressbars。我希望将值设置为HTML属性“值”。

这是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）。我期待这一点。

那么无论如何都要这样做？

Answer 1

您想使用jQuery.each函数。这是一个例子：

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

替代示例：

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

Answer 2

我会循环遍历每个div以确保它抓取正确的“value”属性，因为第一个示例中的$(this)没有给你任何东西，因为this是该上下文中的Window对象

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

Answer 3

您必须设置值属性：

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