Javascript Jquery mouseenter mouseleave无法正常工作

我试图在鼠标悬停时将wp插件的标题从缩略图中移动，并通过以下脚本将其放置在顶部的另一个div中：

$(document).ready(function() {

  $(".caption").mouseenter(function() {

    $(".captiondiv").html("");

    var str = $(".caption-title:visible").text();

    $(".captiondiv").prepend(str);

  }).mouseleave(function() {

    $(".captiondiv").html("");

  });
});

它工作得很好，当我在每个缩略图上缓慢悬停时，标题正确地显示在左上角的视频上：

如果我快速悬停，脚本将显示错误的标题，它将保留以前的标题并添加新的：(

我真的迷路了！请帮帮我

---

致以最诚挚的问候！

如果要替换整个标题，请不要使用'prepend'方法，而是使用.html（）方法来设置元素的内容。

如果要替换整个标题，请不要使用

prepend

。 您只需使用

$（“.captiondiv”）.html（str）；

编辑 问题是元素

（“.caption title:visible”）

有多个值。通过使用

$（this）

元素来获得所需的元素，解决了这个问题

var str = $(this).find(".caption-title:visible").text();
$(".captiondiv").html(str);

$（“ul li img”）。悬停(
函数（）{
var alt=$（this.attr（“alt”）；
$（“strong”）.html（alt）；
},
函数（）{
$（“strong”）.html（“”）；
}
)；

ul{
列表样式类型：无
}
ulli{
浮动：左
}
ulliimg{
/*灰度效应*/
-webkit过滤器：灰度（1）；
-moz滤波器：灰度（1）；
-o-滤波器：灰度（1）；
-ms过滤器：灰度（1）；
过滤器：灰度（1）；
}
ul li img：悬停{
/*清晰灰度效果*/
-webkit过滤器：无；
-moz过滤器：无；
-o-过滤器：无；
-ms过滤器：无；
过滤器：无；
/*设置动画*/
-webkit过渡：所有.3s易于输入输出；
-moz转换：所有.3轻松输入输出；
-o型转换：所有.3s易于输入输出；
-ms转换：所有.3s易于输入输出；
过渡：所有.3s易于输入输出；
}

标题：

这应该可以：

$（文档）.ready（函数（）{
$（“.jig caption”）.mouseenter（函数（）{
var str=$（“.jig标题：可见”）.text（）；
$（“.caption perso”）.html（str）；
}).mouseleave（函数（）{
$（“.caption perso”）.html（“”）；
});
})；

请分享你的html代码。这是一个安装在wp上的插件，我用html（）尝试过，但不起作用，同样的问题：（但是，为什么当我笨拙地悬停时会出现问题？可能是选择器

$（“.jig标题：可见”）

返回多个元素，因为存在从彩色到灰度的转换。没有代码我无法确定。

console.log（$（“.jig标题：可见”））；

将帮助您找到错误。是的，这是一个问题，但我如何才能只显示活动缩略图的标题而不显示：visible？因为当我删除visible时，脚本会显示所有标题，插件使用以下命令：11try

var str=$（this）。find（“.jig caption title:visible”）.text（）；$（.caption perso”）.html（str）；

仅引用鼠标输入元素。如果

jig caption title

是

的子元素，则该选项有效。jig caption

Stop（）函数如何？对元素调用Stop（）函数，即当前运行的动画（如果有）在该元素上，将立即停止。这里我们要设置元素的数据。如果可能，请您以小提琴的形式共享代码。谢谢！但是我要修改的插件用于分组缩略图，这可能是问题所在？这不是问题。这只是预览。您对

鼠标有问题，并且
mouseleave
。看看我自己是怎么解决的。我使用了
hover
，并给了他两个函数。第一个函数类似于
mouseenter
，第二个类似于
mouseleave
。我也有同样的悬停问题：(