jquery（this）.next（）语句不工作。。。语法问题？

无法使用.next（）选择器。我以为这很简单，但我正在做错事

以下是脚本（不起作用）：

以及它所基于的html：

<div class="timeline">
    <div class="segment" style="height:30px">
        <div class="educ">
            <div class="ITEM" >
                <p>High School</p>
                <div class="ITEM_LINE educ_color"></div>
            </div>
        </div>
        <div class="center">
            <div class="midline"></div>
        </div>
    </div>

        ..(repeats)...

</div>

高中

……重复。。。

其想法是这些元素将被重复多次，因此我只希望jquery脚本影响当前的一个悬停。我猜“.midline”div可能需要另一种方法，但至少在“.ITEM_LINE”中应该可以这样做

谢谢

您需要使用，因为您要查找的是子元素，而不是下一个同级元素

$(this).find('.ITEM_LINE').toggleClass('ITEM_LINE_ON');

另外，如果处理程序中的

setTimeout（）

方法出现问题，

此

不再引用悬停的元素，则可以使用闭包变量来解决该问题

$('.ITEM').hover(function () {
    var $this = $(this);
    $this.next('.ITEM_LINE').toggleClass('ITEM_LINE_ON');
    setTimeout(function () {
        $this.closest('.segment').find('.midline').toggleClass('educ_color')
    }, 200);
});

$('.ITEM').hover(function () {
    var $this = $(this);
    $this.next('.ITEM_LINE').toggleClass('ITEM_LINE_ON');
    setTimeout(function () {
        $this.closest('.segment').find('.midline').toggleClass('educ_color')
    }, 200);
});