jquery，如何仅影响单击的元素？

我有以下设置：

<div class="video" id="video_main">
        <div class="video_image_bg video_logo_off" id="video_bg">
            <span class="video_span" id="video_span"></span>
        </div>
<div>
<div class="video" id="video_main">
        <div class="video_image_bg video_logo_off" id="video_bg">
            <span class="video_span" id="video_span"></span>
        </div>
<div>
....
....

一个问题是，当我用鼠标输入时，所有div都会受到影响，而不是我用鼠标实际输入的div

我不知道这是什么意思

第二个问题是，我想使用hover或hoverIntent方法比mouseenter和mouseleave更好，但我不知道如何使用fadeTo获得相同的效果

有什么想法吗

谢谢

在活动中使用此信息，以了解是谁发起了活动

$('.video').mouseenter(function() {
    $(this).find('.video_span').fadeTo("slow", 1);
});
$('.video').mouseleave(function() {
    $(this).find('.video_span').fadeTo("slow", 0);
});

请注意，有多个元素具有相同的video_span和video_main id。id必须是唯一的

每个id值在文档中只能使用一次。如果为多个元素分配了相同的ID，则使用该ID的查询将只选择DOM中第一个匹配的元素。然而，这种行为不应该被依赖；包含多个使用相同ID的元素的文档无效

从jquery

---

每个页面都是一个国家，每个id都是。。。id，同一国家/地区不能有多个id相同的人。

我尝试使用基于类的解决方案，而且同一文档中的id重复。同一文档中的ID必须是唯一的

var videospan = $('.video');

videospan.hover(
function() {
    $(this).find('.video_span').fadeTo("slow", 1);
},
function() {
    $(this).find('.video_span').fadeTo("slow", 1);
});

---

请尝试上面的内容，并让我知道它是如何进行的。

问题1：您为多个元素设置了相同的ID。ID对于您为其设置的元素应该是唯一的。您应该为此使用类

问题2:var videospan=$'.video'.查找'video_span'；告诉它在video类的所有元素下查找ID为video_span的元素

以下是使用代码的正确方法：

<div class="video video_main">
        <div class="video_image_bg video_logo_off video_bg">
            <span class="video_span"></span>
        </div>
<div>
<div class="video video_main">
        <div class="video_image_bg video_logo_off video_bg">
            <span class="video_span"></span>
        </div>
<div>

当一个事件被调用到jQuery时，该事件的上下文将成为触发该事件的元素的HtmlDomeElement。因此，在事件内部，类似于this.style.display、this.appendChild等的内容将起作用。但是，这不是jQuery对象，因此我们使用$this启用jQuery链接和函数，因为jQuery可以接受HtmlDomeElement

---

如果你学到了新东西，请投票，如果这符合你的要求，请接受。

@Patrioticcow。别忘了修好身份证。它可能会导致许多问题。id video_bg和video_跨度也会重复。1999年，人们仍然错误地理解这一点。

<div class="video video_main">
        <div class="video_image_bg video_logo_off video_bg">
            <span class="video_span"></span>
        </div>
<div>
<div class="video video_main">
        <div class="video_image_bg video_logo_off video_bg">
            <span class="video_span"></span>
        </div>
<div>

$('.video').mouseenter(function() {
    var videospan = $(this).find('.video_span');
    videospan.fadeTo("slow", 1);
});
$('.video').mouseleave(function() {
    var videospan = $(this).find('.video_span');
    videospan.fadeTo("slow", 0);
});