Лучший способ использовать onmouseover, onmouseleave

Как я могу лучше использовать onmouseover, onmouseleave и onmousemove в этом файле JSFiddle? 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?


person Alberto Del Villano    schedule 26.05.2015    source источник
comment
Попробуйте с классами вместо идентификаторов.   -  person Nemanja Popovic    schedule 26.05.2015
comment
@NemanjaPopovic да, но мне нужна определенная строка для каждого элемента   -  person Alberto Del Villano    schedule 26.05.2015
comment
Вы можете использовать делегирование событий, что-то вроде этого.   -  person Teemu    schedule 26.05.2015


Ответы (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);
    };
}

ДЕМО

person AmmarCSE    schedule 26.05.2015
comment
да, но мне нужно передать строку для каждого идентификатора: jsfiddle.net/Insane96MCP/xznn7g3d/8 и не работает - person Alberto Del Villano; 26.05.2015
comment
@Insane96MCP, см. jsfiddle.net/xznn7g3d/9, теперь это работает, потому что вам нужно обернуть его в IIFE, потому что он находится в цикле. Дай мне знать, если тебе еще понадобится помощь - person AmmarCSE; 26.05.2015
comment
@ Insane96MCP, это решило вашу проблему? Дай мне знать, если тебе еще понадобится помощь - person AmmarCSE; 27.05.2015
comment
Я сейчас с мобильного, попробую дома - person Alberto Del Villano; 27.05.2015