将百分比添加到jquery旋钮输入值[重复]答案

【问题标题】：Adding Percentages to jquery knob input value [duplicate]将百分比添加到jquery旋钮输入值[重复]
【发布时间】：2014-12-03 13:37:08
【问题描述】：

我正在使用名为 Jquery Knob 的 jQuery 插件 http://anthonyterrien.com/knob/

创建圆形进度条，

这是我的代码

<input type="text" value="90" class="dial" data-width="80" data-height="90" data-readOnly=true data-fgColor="#2ecc71">

JS 旋钮执行

$(".dial").knob();

试图将 ( % ) 附加到 value 属性但它没有呈现

$('.dial').each(function() {

  $(this).attr("value", $(this).attr("value") + "%");

});

有什么建议吗？谢谢！

【问题讨论】：

看起来在值中使用百分比会破坏整个插件。您可能可以将 displayInput 设置为 false，然后向页面添加一个元素以显示您自己的百分比数字，您可以使用插件更改事件进行更新。如果您发布小提琴，如果您遇到问题，我可能会帮助您。
如果您使用 ASCII 等价物会怎样？ .... %
@Rooster 是的，这个值属性必须由插件来工作，我会尝试你的建议，我会用小提琴更新问题
@gtr1971 正如我对 Rooster 所说，值属性必须是插件才能工作的数字
@Rooster 谢谢！在我的进度 div 中创建了一个跨度，隐藏了旋钮值并对其进行了样式设置，现在它工作得很好！

【解决方案1】：

从这个插件的 1.2.7 版开始，有一个 format 挂钩，您可以使用它来更改数字的显示方式。

例如你可以指定：

$(".dial").knob({
  'format' : function (value) {
     return value + '%';
  }
});

【讨论】：

【解决方案2】：

使用下面的代码就可以了

$(".dial").knob({
 'change': function (v) { console.log(v); },
  draw: function () {
  $(this.i).val(this.cv + '%');
  }
 });

【讨论】：