使用 onmouseover、onmouseleave 的更好方法

Question

如何在此 JSFiddle 文件中更好地利用 onmouseover、onmouseleave 和 onmousemove？ http://jsfiddle.net/Insane96MCP/xznn7g3d/5/

你可以看到我有：

document.getElementById("button1").onmouseover = function(){
    showToolTip(/*...*/);
}
document.getElementById("button1").onmouseleave = function(){
    hideTooltip(/*...*/);
}
document.getElementById("button1").onmousemove = function(){
    showTooltip(/*...*/);
}
document.getElementById("button2").onmouseover = function(){
    showTooltip(/*...*/);
}
//And so on

有一个更好的方法来做到这一点，而不是连续堆叠它们，创建一个很长的 javascript?

Answer 1

像这样使用数组和for循环

var ids = ['time', 'start', 'pause'];
for (var i = 0; i < ids.length; i++) {
    document.getElementById(ids[i]).onmouseover = function(e) {
        showTooltip(Strings.timeTooltip, e);
    };

    document.getElementById(ids[i]).onmouseleave = function(e) {
        hideTooltip();
    };

    document.getElementById(ids[i]).onmousemove = function(e) {
        showTooltip(Strings.timeTooltip, e);
    };
}

DEMO

使用 onmouseover、onmouseleave 的更好方法

A better way to use onmouseover, onmouseleave

javascript

onmouseover