javascript - 如何让一个事件调用多个函数？ D3/Javascript

Question

当鼠标在节点上/离开节点时，我有这些调用

    .on("mouseover", highlightImage)
    .on("mouseout", unhighlightImage)

    .on("mouseover", showTextToolTip)
    .on("mouseout", hideTextToolTip)

现在，由于 javascript 是异步读取的，因此只调用底部的两个函数。我环顾四周，发现了几个例子:

.on("mouseover", "highlightImage(); showTextToolTip()") //- doesnt work

.on("mouseover", mouseOverFunctions) //- calls a function>

function mouseOverFunctions(){
    showTextToolTip();
    highlightImage();
    } //- also doesnt work.

我猜这是因为“鼠标悬停”一次只能调用一个对象。

如何同时调用这两个函数？我希望显示文本并突出显示节点

---

添加代码

function showTextToolTip(d){
if(textButtonPressed==false){
d3.select(this).append("text")
    .attr("dx", "2")
    .attr("dy", "-24")
    .style("text-anchor", "start")
    .text(function(d) { return d.identifier; });
    showToolTip="true";
}}

function highlightImage(d){
    d3.select(this).classed("highlighted", true);
    highlightedNode = d.coreId;
    //console.log("Highlighted node : " + highlightedNode);
}   

Answer 1

定义一个调用它们的匿名函数:

.on("mouseover", function(d) {
  highlightImage(d);
  showTextToolTip(d);
});

mouseout 也是如此。

如果您在处理函数中引用 this，则需要使用不同的方式调用函数以确保它被正确传递:

.on("mouseover", function(d) {
  highlightImage.call(this, d);
  showTextToolTip.call(this, d);
});