Question

我有以下代码;

$('.time-span').hover(function () {
    $('.leftRadius,.rightRadius').addClass('hovered');
},
function () {
    $('.leftRadius,.rightRadius').removeClass('hovered'); 
});

我的标记看起来像这样：

<DIV class=leftRadius></DIV>
<A class=time-span ></A>
<DIV class=rightRadius></DIV>

<DIV class=leftRadius></DIV>
<A class=time-span ></A>
<DIV class=rightRadius></DIV>

<DIV class=leftRadius></DIV>
<A class=time-span ></A>
<DIV class=rightRadius></DIV>

如何编辑它以仅针对一个'.time-span'类（我的文档中有多个，我不能使用id）？

由于

Answer 1

从您的标记中，我认为您想为特定部分编写悬停..

$('.time-span').hover(function () {
    $(this).prev().addClass('hovered');
    $(this).next().addClass('hovered');
},
function () {
    $(this).prev().removeClass('hovered');
    $(this).next().removeClass('hovered');
});

或简单地说，

$('.time-span').hover(function () {
    $(this).prev().toggleClass('hovered');
    $(this).next().toggleClass('hovered');
});

Answer 2

参见'：eq（x）'作为css选择器：

:eq() Selector

例如：

$('.time-span:eq(0)').hover(function () { //:eq(0) for first occurence
    $('.leftRadius,.rightRadius').addClass('hovered');
}

Answer 3

你也可以在这里使用get（index），即：

$('.time-span').get(0).hover(function () ...

使用jquery仅选择所选类

3 个答案: