javascript - 如何使用 iframe 在鼠标悬停时触发事件

Question

我已经尝试了所有方法，但无法获取下一个 iframe 的值，i 帧是使用 PHP 输出的。 (下面的代码)

    <div class="video" vid="'.$userID.'" '.$style.'"><iframe vid="'.$userID.'" width="200" height="200" src="http://www.youtube.com/embed/'.$urlLink.'?autoplay=1&wmode=transparent" frameborder="0" allowfullscreen></iframe></div>

视频id来自数据库。我目前有两个视频，它们都显示不同的提要，因此 src 工作正常并且 vid="" 是根据用户 ID 设置的，这也在改变每个时间正确(我已经用 inspect element 验证了这一点)。

我遇到的问题是试图从 div 中获取 vid attr 以在 mouseenter 上进行更改。使用下面的代码，我收到一个弹出窗口，但视频 ID 没有改变。它只是提醒 div vid="" 值的第一个实例。

我真的卡住了，所以任何建议都会很棒。

$(document).on('mouseenter','div.video',function(e){

e.stopPropagation();

var videoID = jQuery('div.video').attr("vid");

 alert(videoID);

});

Answer 1

当您选择所有元素时，您将从集合中的第一个元素获取值。要仅选择悬停的元素，请使用 this 关键字:

$(document).on('mouseenter','.video',function(){
    var videoID = $(this).attr("vid");
    alert(videoID);
});