jQuery Mouseover DOM

Question

我有一些元素（我不知道的總數）。當我將這些元素中的任何一個（通過綁定這些元素的共享類來綁定mouseover）時，我希望出現一些東西。

但是，我想要出現在mouseover上的東西取決於遊標的結果 - 所以我需要獲取遊標下的DOM元素，而沒有奢侈的能夠將mouseover事件綁定到碼。

有什麼建議嗎？

Answer 1

HTML：

<a id="say1" class="say" href="#" data-word="one">Say 'one'</a> 
<a id="say2" class="say" href="#" data-word="two">Say 'two'</a> 
<a id="say3" class="say" href="#" data-word="three">Say 'three'</a> 

的JavaScript（用jQuery）：

$(document).ready(function() { 
    $('.say').mouseover(function() { 
    alert($(this).data('word')); 
    }); 
}); 

純JavaScript（不包括jQuery的，它是不相等）：

window.onload = function() { 
    var onmouseover = function (e) { 
    alert(e.target.getAttribute('data-word')); 
    }; 

    var elems = document.getElementsByClassName('say'); 

    for (var i = 0; i < elems.length; i += 1) { 
    elems[i].onmouseover = onmouseover; 
    } 
}; 

而不是調用alert函數，您可以實現任何邏輯。

Answer 2

活動代表團是你的朋友在這裏。

從Christian Heilmann看這個帖子http://www.icant.co.uk/sandbox/eventdelegation/。

HTH。

Answer 3

jQuery讓這容易.each()：

$('#container').bind('mouseover', function() { 
     $(".selector").each(function(){ 
       // Do something $(this) = item clicked 
       $(this).toggleClass('.example'); // Toggle class is just an example 
     }); 
}); 

然後，您可以檢查$（本）某些特徵，然後以此爲基礎進行的值/特性不同的東西。