我通过websockets获取旋钮值,并且能够通过document.elementId在html页面上显示值。 然而,我然后尝试根据此值更新旋钮,它不会发生
<table id="speedTable">
<tr>
<td>revolutions</td></tr>
<tr><td id="revolutions"></td>
</tr>
</table>
<input type="text" class="dial" id="revdial" value="0" data-width="120" data-thickness="0.4" >
</div>
$(document).ready(function() {
$('.dial').knob({
'min': 0,
'max': 100,
'step': 1,
'readOnly': false,
'linecap': 'round',
'displayInput': true,
'displayPrevious': false,
'angleOffset': -125,
'angleArc': 250
});
$('#revolutions).trigger('configure', {
'draw': function (v) {
v=parseInt(document.getElementById('revolutions').value);
if (v > 2050 ) {
this.o.fgColor='red';
$("#revdial").css("color", "red");
}
if (v <= 2030 ) {
this.o.fgColor='#87CEEB';
$("#revdial").css("color", "#87CEEB");
}
if (v > 2000 && v<=2030) {
this.o.fgColor='#87CEEB';
$("#revdial").css("color", "#87CEEB");
}
},
'format': function (v) {
return v + ' %';
}
});
$('#revdial').trigger('change');
});
请帮忙。谢谢
答案 0 :(得分:0)
根据您的意见,我根据jQuery roundSlider插件准备了一个类似于您的要求的演示。请查看以下演示,可根据您的要求进一步定制。
DEMO
有关详细信息,请查看demos和documentation页。