当鼠标指针悬停在JavaScript上时,如何使用JavaScript突出显示(css:background-color)单词?应该可以通过点击选择它并将其保存在一个变量中。JavaScript:突出显示/选择鼠标指针下的单词
2
A
回答
4
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/
+0
这是一个很好的答案,但请记住,这可能会很慢,大量的文本。 – tobint 2011-03-27 11:11:21
+0
嗯..可能会慢..不知道是否有更好的更快的方法.. – 2011-03-27 11:15:39
+0
悬停样式可以用CSS来完成,'委托'会减少事件在击中之前必须经过的元素数量处理程序。否则,可能没有其他方法可以高效地完成这个 – 2011-03-27 11:17:08
相关问题
- 1. 单词在鼠标上突出显示
- 2. 在Qt中选择鼠标指针下的单词
- 3. emacs xterm鼠标模式双击以突出显示单词
- 4. 如何从鼠标的段落中选择和突出显示单词,即使在jquery或javascript中?
- 5. 选择AvalonEdit中突出显示的单词的所有实例
- 6. 简单的javascript鼠标撤消突出显示文本
- 7. 用鼠标在treepanel中选择(突出显示)儿童
- 8. 如何突出显示替换所选单词的单词?
- 9. Safari浏览器:获取鼠标指针下的单词
- 10. JavaScript鼠标光标指针
- 11. emacs在光标下突出显示单词
- 12. 突出显示ListView选择
- 13. 如何创建单词选择器以选择并突出显示并从文本中移除所选单词?
- 14. WPF ListBox用鼠标选择单词
- 15. 如何使用鼠标指针在tcl/tk上突出显示一个对象?
- 16. 突出显示DataGridView中的单词?
- 17. 国家对鼠标突出显示了
- 18. JavaScript:从页面中删除当前的鼠标突出显示?
- 19. 使用CSS突出显示鼠标向下的div
- 20. 尝试选择具有较低Z指标的鼠标(突出显示文本)div的内容
- 21. 在RichEditBox中突出显示单词
- 22. 我需要突出显示单词
- 23. 突出显示一堆单词?
- 24. jquery突出显示单词只有
- 25. 使用jquery突出显示单词
- 26. 从数组中突出显示单词
- 27. Vim突出显示单词列表
- 28. 用角度突出显示单词
- 29. mark.js不突出显示单词?
- 30. 在longpress上突出显示单词android
[获取鼠标指针下的文本]的可能重复(http://stackoverflow.com/questions/2183335/getting-the-text-under-the -mouse-pointer) – 2011-03-27 11:15:29