如何在jquery中动态改变旋钮的值？
如何在jquery中动态改变旋钮的值？
提问于 2014-09-17 17:45:45
我已经应用了一个具有只读特性的jquery旋钮，如下所示：
<style>
.test{
background: #292929;
margin:50px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://raw.github.com/aterrien/jQuery-Knob/master/js/jquery.knob.js"></script>
<body>
<input type="text" value="45%" class="dial"><button id="change">Change</button>
</body>
<script>
$(".dial").knob({
readOnly: true,
fgColor: "#00ABC6",
bgColor: "#666666",
thickness: 0.2
});
$(document.body).on('click', 'button#change', function(){
$("input.dial").val('80%');
})
</script>现在，当我点击change按钮时，它只改变了input标签的值，但不能改变旋钮填充区域的百分比。
回答 2
Stack Overflow用户
回答已采纳
发布于 2014-09-17 17:45:45
只需在设置输入的值后触发更改事件，如下所示：
$("input.dial").trigger('change');您的代码将如下所示：
<style>
.test{
background: #292929;
margin:50px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://raw.github.com/aterrien/jQuery-Knob/master/js/jquery.knob.js"></script>
<body>
<input type="text" value="45%" class="dial"><button id="change">Change</button>
</body>
<script>
$(".dial").knob({
readOnly: true,
fgColor: "#00ABC6",
bgColor: "#666666",
thickness: 0.2
});
$(document.body).on('click', 'button#change', function(){
$("input.dial").val('80%');
$("input.dial").trigger('change');
})
</script>Stack Overflow用户
发布于 2016-11-21 17:43:54
您可以使用Jquery中的change trigger：
// on line to change
$('.dial').val(27).trigger('change');页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25887224
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号