识别Javascript onhover上的单词

时间:2013-12-27 18:01:02

标签: javascript jquery regex javascript-events cursor

我正在查看stackoverflow并遇到此链接(How to get a word under cursor using JavaScript?

他们有代码:

<p>Each word will be wrapped in a span.</p>
<p>A second paragraph here.</p>
Word: <span id="word"></span>

<script type="text/javascript">
    $(function() {
        // wrap words in spans
        $('p').each(function() {
            var $this = $(this);
            $this.html($this.text().replace(/\b(\w+)\b/g, "<span>$1</span>"));
        });

        // bind to each span
        $('p span').hover(
            function() { $('#word').text($(this).css('background-color','#ffff66').text()); },
            function() { $('#word').text(''); $(this).css('background-color',''); }
        );
    });
</script>

当我尝试这个时,我意识到这段代码只能用于段落标记。我应该如何编辑此代码的Javascript / Regex以使其工作所有标签(h1,h2,h3)?

提前致谢!

1 个答案:

答案 0 :(得分:1)

jsFiddle Demo

进行一些调整。将选择器更改为包含h1,h2,h3

$('p,h1,h2,h3').each(function() {

然后在悬停时也会降低此值。您需要在集合上使用find来嵌套跨度。

$('p,h1,h2,h3').find("span").hover(