jQuery mouseenter 在带有粗体文本的段落上

Question

我有一段带有粗体字的段落

<p style="class1"><b>Some text</b> some other text</p>

以及用于mouseenter 和class1 元素的mouseout 事件的jQuery 侦听器

$('class1').mouseenter(function(){
    $(this).addClass("highlight");
});

$('class1').mouseout(function(){
    $(this).removeClass("highlight");
});

highlight 类是一种模拟经典 HTML 选择的样式。

.highlight{
   background-color: blue;
   color: white !important
}

（我没有使用 style1:hover 因为我想以编程方式模拟箭头选择，但这现在并不重要）

所以，我有一些这样的段落：

一些文字一些其他文字

一些文字一些其他文字

一些文字一些其他文字

现在，我的问题是当鼠标光标从粗体文本移动到普通文本（或反之亦然）时，mouseout 事件触发，失去我的假选择但留在同一段落中。如何避免这种行为？

Answer 1

你必须使用 mouseleave 事件而不是 mouseout..

$('.class1').mouseenter(function(){
    $(this).addClass("highlight");
});

$('.class1').mouseleave(function(){
    $(this).removeClass("highlight");
});

这会解决你的问题..:)

Answer 2

我不明白这个问题..但是让我建议你...永远不要使用标签！如果你想要一个粗体的文本，在它上面加上一个跨度并使用 css font-weight:bold; ..