選擇所有具有相同類別的元素

Question

我希望在懸停時突出顯示頁面上具有相同類別的所有元素。

代碼我到目前爲止有：

$(document).ready(function() { 
$('p.myclass').mouseover(function() { 
    $(this).addClass('hover'); 
}); 
$('p.myclass').mouseout(function() { 
    $(this).removeClass('hover'); 
}); 
}); 

My brief example: JSFiddle

目前它強調只有我在上空盤旋的元素。但我希望它突出顯示所有具有相同類的元素。這將如何完成？ 我不是特別的，它是在CSS3還是JQuery中完成。

Answer 1

由於mouseover將查詢集合中的每個元素分別附加一個事件處理函數，回調函數內的this值是您懸停的元素，而不是整個集合。使用選擇器代替this。

$('p.myclass').mouseover(function() { 
    $('p.myclass').addClass('hover'); 
}); 

或者，你可以緩存你的收集和引用它的微薄積蓄在效率方面：

var coll = $('p.myclass'); 
coll.mouseover(function() { 
    coll.addClass('hover'); 
}); 

Answer 2

使用

$(document).ready(function() { 
$('p.myclass').mouseover(function() { 
    $('p.myclass').addClass('hover'); 
}); 
$('p.myclass').mouseout(function() { 
    $('p.myclass').removeClass('hover'); 
}); 
});