创建MangoSlick进度条后更新它

Question

我被分配将MangoSlick主题集成到我们当前的管理面板， 它是一个jQuery，Slick（？）和响应模板。

首先，让我解释一下API的用途

在文档中，它只说这是唯一的方法

data-[options]=[value]

实施例： 如果我想做一个进度条

我可以使用这种格式

<div class="progress">
            <div class="bar" data-title="[title]" data-value="[value]" data-max="[max]" data-format="[format string]"></div>
</div>

所以填写值

<div class="progress">
        <div class="bar" data-title="Space" data-value="1285" data-max="5120" data-format="0,0 MB"></div>
</div>

我将此作为输出

现在，主要的问题是当我使用jQuery attr（）来更改data-title，data-max，data-value和data-format的属性值时。

为什么不起作用？

<script>
    var jq = $.noConflict();
    jq(document).ready(function(){
      jq('#bokz').attr("data-title", "No Space");
    });
</script>

使用上面的脚本并检查chrome中的元素值是否已更改

但不在进度条

中

你们中的一些人可能对此有一些想法吗？

非常感谢任何帮助/建议。

Answer 1

通用格式data-foo="bar"的属性由jQuery使用.data()方法读取和写入。

所以你可以试试这个：

var jq = $.noConflict();
jq(document).ready(function(){
  jq('#bokz').data("title", "No Space");
});

可能有效，但可能取决于调用.data()方法的时间。

我猜测.data("title", "No Space")只会在进度条初始化之前有效。

要在初始化之后设置它，我希望您需要直接在进度条的API上调用某些方法。如果是这样，那么您需要查看小部件的文档以找到适当的方法，例如.setTitle(bar)或.progressBar('setTitle', bar)。