我通过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');
});
请帮忙。谢谢
根据您的评论,我准备了一个类似于您的基于jQuery roundSlider插件的演示。请查看下面的演示,它可以根据您的要求进一步定制。
DEMO
有关更多详细信息,请查看演示和文档页面。