JavaScript:在鼠标指针下突出显示/选择单词

当鼠标指针hover在一个单词上时,如何使用JavaScript突出显示(css:background-color)单词? 应该可以通过单击它然后将其保存在变量中来选择它。

var words=$("#yourTextContainer").text().split(' '); $("#yourTextContainer").html(""); $.each(words, function(i,val){ //wrap each word in a span tag $('').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/