JavaScript : 마우스 포인터 아래에 단어 강조 표시/선택

Question

마우스 포인터를 가져 가면 JavaScript로 단어를 강조 표시 (css : background-color)하려면 어떻게합니까? 그것을 클릭하고 변수에 저장하여 선택할 수 있어야합니다.

Answer 1

var words=$("#yourTextContainer").text().split(' '); 
$("#yourTextContainer").html(""); 
$.each(words, function(i,val){ 
//wrap each word in a span tag 
$('<span/>').text(val+" ").appendTo("#yourTextContainer"); 

}); 
$("#yourTextContainer span").live("mouseover",function(){ 
//highlight a word when hovered 
$(this).css("background-color","yellow"); 
}); 
$("#yourTextContainer span").live("mouseout",function(){ 
//change bg to white if not selected 
if($(this).css("background-color") !="rgb(0, 0, 255)") 
{ 
$(this).css("background-color","white"); 
} 
}); 
$("#yourTextContainer span").live("click",function(){ 
$("#yourTextContainer span").css("background-color","white"); 
$(this).css("background-color","blue"); 
//gets the text of clicked span tag 
var text = $(this).text(); 
}); 

편집 : 예를 참조 http://jsfiddle.net/aD5Mu/