Question

我有根据数据库查询结果集中的行生成的进度条（通过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')
    })

Answer 1

如果您在谈论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改变它的值而不是使用插件，除非有必要。

为动态创建的JQuery进度条设置值

1 个答案: