节点上的d3事件处理程序不在HTML DOM中

Question

我使用模板系统返回由d3代码生成的SVG代码。 （有关信息，请参阅d3 issue如何执行此操作）

一切正常，但使用d3的on方法设置的事件侦听器除外。它们不会被添加到DOM树中。

下面是一个不起作用的简单代码示例。如果d3直接修改现有的DOM树，则一切正常（取消注释行3而不是1和2）。

任何想法要改变这个工作？

svg = d3.select(document.createElement('div')); 
svg 

//d3.select('body') // if you use this line INSTEAD of the first two, everything works as expected 

.append("div")  
.append("div") 
.text('Text') 
.on('mouseover', function() { alert('Test'); }); 

//alert(svg.node().innerHTML); 
$("body").html(svg.node().innerHTML); 

JSFiddle

Answer 1

不同的是，在一个情况下，你在页面的DOM充当一个元素上尚未：svg = d3.select(document.createElement('div'));

虽然对你的行为的元素已经在其他页面svg = d3.select('body')

D3无法将侦听器添加到不在DOM中的东西。

看看这个JSFiddle，我在页面中添加div后添加mouseover。