Question

按ID选择元素后，我发现ID未定义。

放在一起

设置元素：

<pre id='output'></pre>
<input id='my-checkbox' type='checkbox'>

d3脚本：

d3.select('#my-checkbox')
    .call(function(){
        document.getElementById('output').outerHTML = this.id;
    })
    .on('click', function(){
        document.getElementById('output').outerHTML = this.id;
    });

这将使用＆＃34; undefined＆＃34;填充pre元素。即使单击该框也会持续存在。另一方面，下面的脚本按照我的预期工作：

d3.select('#my-checkbox')
    .on('click', function(){
        document.getElementById('output').outerHTML = this.id;
    });

这里发生了什么？如何在d3的call功能中访问元素的ID？

Answer 1

您将获取元素对象作为第一个参数：

d3.select('#my-checkbox').call(function(s){
    document.getElementById('output').outerHTML = s.attr('id');
});

Answer 2

来自d3文档

与function.call类似，调用指定类型的每个已注册的回调，将回调传递给指定的参数，并将其作为此上下文。有关更多信息，请参阅dispatch.apply。

您正在寻找的功能是each

.each(function(){
    document.getElementById('output').outerHTML = this.id;
})

d3选择的ID未定义

2 个答案: