此事件处理程序在做什么

Question

我尝试检查 DOM 等，但不确定为什么将".tooltip"附加到处理程序。如果删除它不会影响任何东西，并且似乎没有显着的价值：

    g.selectAll("circle")
        //
        //why is .tooltip appended here?
        //
        .on("mouseover.tooltip", function(d) {
        d3.select("text#" + d.line_id).remove();
        d3.select("#chart")
            .append("text")
            .text(d.late_percent + "%")
                .attr("x", time_scale(d.time) + 10)
                .attr("y", percent_scale(d.late_percent) - 10)
                .attr("id", d.line_id);
    });

任何澄清都非常感谢。

Answer 1

它是一个

命名空间

http://api.jquery.com/on/

http://docs.jquery.com/Namespaced_Events

"jQuery提供了一个称为命名空间事件的概念：只需添加一个 声明事件时的类名。然后，您可以参考 具有取消绑定和触发器的命名空间事件。

$('.class').bind('click.namespace', function(){}); 
$('.class').trigger('click.namespace');
$('.class').unbind('click.namespace');

Answer 2

在这种情况下，如 selection.on 的 D3 文档中所述，这只是为同一事件注册多个侦听器的一种方法。例如，如果要为mouseover注册两个侦听器，则需要使用 .on("mouseover.foo",... 和 .on("mouseover.bar",... 。

否则，如果您只使用.on("mouseover",..两次，您将替换已注册的侦听器mouseover而不是添加新的侦听器。tooltip部分没有特殊含义，它只是一个标识符。