Question

我希望能够使用jQuery 1.4.4循环锚点选择。

以下LI元素时，以下内容有效：

HTML：

<ul class="rotating-banner">
    <li class="active"><a>1</a></li>
    <li><a>2</a></li>
    <li><a>3</a></li>
    <li><a>4</a></li>
</ul>

JavaScript（针对jQuery 1.4.4）：

rotateBanner = function() {
    var active = $('ul.rotating-banner li.active');
    var next = active.next();
    if (next.length === 0) {
        next = $('ul.rotating-banner li:first');
    }

    active.removeClass('active');
    next.addClass('active');
}
setInterval(rotateBanner, 1000);

这可以在这里看到：http://jsfiddle.net/Carnotaurus2/Yq9AA/

然而，正如我所说，我希望在UL元素中的所有LI元素上定位嵌套锚标记（每个LI元素中只能有一个锚标记）。因此，例如，在第一个滴答间隔，我们选择了第一个锚标记：

<ul class="rotating-banner">
    <li><a class="active">1</a></li>
    <li><a>2</a></li>
    <li><a>3</a></li>
    <li><a>4</a></li>
</ul>

然后在下一个时间间隔，我们选择了第二个：

<ul class="rotating-banner">
    <li><a>1</a></li>
    <li><a class="active">2</a></li>
    <li><a>3</a></li>
    <li><a>4</a></li>
</ul>

在最终选择之后，第一个锚标记被选择 ad infinitum 。

Answer 1

为了获得锚标签，我改变了选择器：

var active = $('ul.rotating-banner li a.active');
var next = active.parent().next().find('a');

这是一个工作小提琴（无限循环）：http://jsfiddle.net/Yq9AA/1/

我错过了 ad infinitum 部分，更新了我的小提琴（这个周期只有一次）：http://jsfiddle.net/Yq9AA/2/

Answer 2

试试这个

rotateBanner = function() {
    var active = $('ul.rotating-banner a.active');
    var next = active.parent().next();
    if (next.length === 0) {
        next = $('ul.rotating-banner a:first');
    }
    else{
        next = next.find("a");
    }

    active.removeClass('active');
    next.addClass('active');
}
setInterval(rotateBanner, 1000);

添加然后将类移除到JavaScript计时器上的锚元素

2 个答案: