Javascript 添加类以触发jquery函数

我使用d3js创建了一些圆圈（节点），当点击时，这些圆圈（节点）会触发不同的覆盖（比如模态）

单击类时会触发覆盖：

$(".overlay01").click(function(){
      setTimeout(
        function() {
            $(".location-modal").toggleClass("active");
        },500);
});

我正在从数据中将类添加到d3节点：

var nodes = svg.selectAll("circle")
                .data(nodes)
                .enter()
                .append("a")

                .attr("class", function(d) { return d.class; })

                .append("circle")
                .attr("r", 20)
                .style("fill", "#fff")
                .style("cursor", "pointer")
                .call(force.drag);

现在。。。在浏览器检查器中，我可以看到节点（圆）添加了类（在本例中）

<a class="overlay01">

我遗漏了什么？？？
我猜您是在创建元素之前应用了“单击”事件。尝试使用委派，以便事件将绑定到
主体
，然后每次事件触发时，委派者都会查看是否单击了其类为“overlay01”的子级

$("body").on("click", ".overlay01", function(){
      setTimeout(
        function() {
            $(".location-modal").toggleClass("active");
        },500);
});

另一种解决方案是，在使用
$（document）.ready（callback）
或其他方法添加事件之前，等待加载“.overlay01”。
如果可能的话，使用jQuery操作svg是一件非常痛苦的事。尤其是
.attr（）
和
切换类（）
无法在svg内容上正常工作。它们设计用于html，并且在应用于其他名称空间时会造成问题。您应该坚持使用d3才能正常工作：

d3.selectAll(".overlay01")
  .on("click", function() {
    setTimeout(function() {
      d3.selectAll(".location-modal")
        .classed("active", function() { 
          return !d3.select(this).classed("active");   // This will actually toggle the class
        });
    },500);
  });

我在我自己的便笺簿上尝试了这段代码，它可能需要一些改进，但应该可以让你开始了
请看，其中的共识是“不，他们不应该”！这似乎不是问题：（我在html中有一个与同一类的链接，它触发模式罚款，只是不是从节点开始的……太令人沮丧了；）查看您的示例，我找不到一个地方可以嵌入我发布的解决方案。在执行
attr（）
和
toggleClass（）时，仍然有很多jQuery的东西
由于我的回答中所述的原因，这将不起作用。尝试合并建议的更改。提供精简的提琴可能对找到问题的解决方案也很有价值。这是精简的提琴…问题在于它有效（LOL）…所以我现在试图找出我做错了什么：不幸的是，它不起作用。虽然它附加了点击处理程序，但正如前面提到的，它无法使用jQuery切换类。我必须提供一个工作示例，其中仍然包含一些jQuery。就我个人而言，我更愿意将其留给d3，最终采用answer我建议（我也建议你用这种方式演奏小提琴）。好的……我现在明白你的意思了……谢谢你的帮助：）我对最初的想法做了一些修改，并按照我的想象让它发挥作用。。。但是现在我在从节点创建一个组时遇到了问题，这样我就可以在鼠标上方追加文本并更改节点（“圆”）的大小。。。因为它和投影连在一起，我猜？！帮助：(