[英]d3.js selection not working
In this JSFiddle , both inputs (textbox and slider) are bound to each other. 在这个JSFiddle中 ,两个输入(文本框和滑块)相互绑定。 When the slider is dragged it perfectly updated the textbox. 拖动滑块时,它完全更新了文本框。 However, when textbox value is manually changed it does not update slider position. 但是,手动更改文本框值时,它不会更新滑块位置。 After any manual change to the text box, the slider no longer updates the textbox when dragged. 手动更改到文本框后,滑块不再更新文本框。 Please help me find out the cause of this behaviour. 请帮我找出这种行为的原因。
HTML HTML
<input id="textbox" type="number">
<input id="slider" type="range" min="0" max="1000">
JS JS
d3.select("#textbox").on("input", function() {
// the following line is not updating slider position
d3.select("#slider").attr("value", this.value);
// when the following lines are un-commented it works perfectly
// var s = document.getElementById("slider");
// s.value = this.value;
});
d3.select("#slider").on("input", function() {
d3.select("#textbox").attr("value", this.value);
});
Using HTML slider (and not d3-slider which is another option), the "value" attribute only set the initial value ! 使用HTML滑块(而不是d3-slider这是另一种选择),“value” 属性只设置初始值 !
To set dynamically use the property 要动态设置属性
d3.select("#slider").property("value", this.value);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.