从Jquery中的hover()获取悬停单词？

Question

我想根据鼠标悬停在其上的单词进行自动翻译。我用

$('p').hover(function () {
  var hoveredWord = $(this).text();
  translate(hoveredWord, 'en'); // function to translate a word to English Language
});

它将返回段落内的整个文本，但是，我只想要一个我悬停的单词而不是整个文本。Jquery 中有什么函数可以用来存档吗？谢谢。

Answer 1

我会用不同的方式来做。我将使用以下方法包装所有文本内容<span>：

$(function() {
  $('p').html(function () {
    var cont = [];
    return "<span>" + $(this).text().split(" ").join("</span> <span>") + "</span>";
  }).on("mouseover", "span", function() {
    var hoveredWord = $(this).text();
    console.log(hoveredWord);
    // translate(hoveredWord, 'en'); // function to translate a word to English Language
  });
});

span:hover {background: #ccf;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Hello, World! How are you?</p>

而且我不会使用该hover功能。它不可靠且已被弃用。