我有基于数据库查询结果集中的行生成的进度条(通过 MVC Razor 获得):
foreach (var @row in rows) {
<li>
<div class="progress-bar id-@row.id"></div>
<div class="label">@row.Name</div>
</li>
}
查询结果有一个名为@row.Value 的列,这是进度条需要的值,但我正在尝试弄清楚如何在创建每个进度条时为它设置该值。我尝试了各种 JQuery 选择器,以及在进度条 div 之后立即调用 JavaScript 函数并传入 @row.Value,但我似乎无法让它工作。
此外,进度条是标准的 JQuery 进度条,目前是这样设置的:
$('.progress-bar').progressbar();
关于如何实现这一点有什么建议吗?
编辑:
这最终对我有用:
$('#active-skill-list').find('li').each(function () {
var progressBar = $(this).find('.progress-bar');
progressBar.progressbar({
value: progressBar.data('value')
})
最佳答案
如果您谈论 jquery UI 进度条,您只需将该值添加到您的 dom 中即可
foreach (var @row in rows) {
<li>
<div class="progress-bar id-@row.id" data-value="@row.value"></div>
<div class="label">@row.Name</div>
</li>
}
//在你的 js 部分有这样的东西
$('YourUlContainer').find('li').each(function(){
$(this).progressbar({ value: $(this).data('value') });
})
目标是将该值添加到 dom 中,并用它们的值触发每个 li。但我建议您通过使用 css 来更简单地做到这一点,除非有必要,否则用 js 更改它的值而不是使用插件。
关于javascript - 为动态创建的 JQuery 进度条设置值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22584864/