如何用d3更新文本输入的内容？

Question

我试图在D3中创建一个文本输入控件，需要将数据推送到文本输入。 我能够设置初始值

d3.selectAll('#textfield')
    .data([number])
    .attr('value', function(d) { return d })

但是，一旦有人编辑文本然后尝试外部更新，这是没用的。 有没有办法将内容设置为某个任意值？

我在JsFiddle中得到了代码 。

更新：

我找到了一个解决方法 ：

var node = d3.selectAll('#textfield')
    .data([number])
    .node()
node.value = number

但我不确定这是否是正确的方法。 有线索吗？

Answer 1

您正在设置 value属性的value ，而恰好是一个特殊属性，它与setAttribute函数（ d3内部用于设置属性）无关。

这种方法并没有好多少，但更实际的使用D3 ：

d3.selectAll('#textfield')
    .data([number])
    .each(function (d) {
        this.value = d;
    });

演示： http ： //jsfiddle.net/LGtDD/3/

---

此外，人们可以（也许应该 ）使用普通的JS来做到这一点，除非你有一个令人信服的论据。 使用D3可能只是过度杀伤：

document.getElementById('textfield').value = number;

Answer 2

您可以使用设置文本输入值

d3.select('#textfield').property('value', "<your desired text>");

Answer 3

这似乎也有效：

function changeValue() {
    var number = Math.round(Math.random()*100);
    d3.select('#textfield')[0][0].value = number;
}