Jquery on('单击'）..函数只执行一次

Jquery on('click').... Function Execute only once

本文关键字：一次 执行 单击 on Jquery 函数      更新时间：2024-06-10

所以我得到了：

var current = $('.article.active');
$('div').on("click", function() {
    if(current.next('.article').hasClass('hide')){
        $(current).addClass('hide');
        $(current).next('.article').removeClass('hide');
    };  
});

和Html:

<body>
    <div class="app">
        <div id="article0" class="article active"></div>
        <div id="article1" class="article hide"></div>
        <div id="article2" class="article hide"></div>
    </div>

因此，当我点击div时，代码可以工作，但只有一次。我想为每个分区执行多次。

JSFIDDLE：http://jsfiddle.net/9xrpuru9/

您需要在点击处理程序中找到活动元素，而且活动类也必须更改

$('div.app').on("click", function () {
    var current = $('.article.active');
    $(current).addClass('hide').removeClass('active');
    if (current.next('.article').length) {
        $(current).next('.article').removeClass('hide').addClass('active');
    } else {
        $('.article:first').removeClass('hide').addClass('active');
    }
});

演示：Fiddle

您没有将活动类设置为下一篇文章的div。

您可以尝试以下代码。

$('.article').on("click", function () {
        if ($(this).next('.article').hasClass('hide')) {
            $(this).addClass('hide').removeClass('active');
            $(this).next('.article').removeClass('hide').addClass('active');
        };
    });
相关文章：