jQuery: addClass and click function for this class

jQuery: addClass and click function for this class

本文关键字：for this class function click addClass and jQuery      更新时间：2023-09-26

我设置了 2 个单击函数，第一个允许您单击并滚动浏览.testdiv。在此之后，.test:last-child的目标是删除red类，添加blue类，然后在blue类div 上触发单击函数，并将其隐藏。唯一的问题是它似乎无法识别.bluediv 上的单击功能并且不起作用。
jsFiddle demo：http://jsfiddle.net/neal_fletcher/adMYV/1/
.HTML：

<div class="test red"></div>
<div class="test red"></div>
<div class="test red"></div>
<div class="test red"></div>
<div class="test red"></div>

j查询：

$(document).ready(function () {
    $(".red").click(function () {
        var next;
        next = $(this).nextAll(".test");
        $('html, body').animate({
            scrollTop: next.offset().top
        }, "slow");
        return false;
    });
});

$(document).ready(function () {
    $('.test:last-child').removeClass('red').addClass('blue');
    $('.blue').click(function () {
        $(this).hide();
        return false;
    });
});

任何建议将不胜感激！

尝试如下：

http://jsfiddle.net/adMYV/3/

法典 

$(document).on("click", ".blue", function () {
    $(this).hide();
    return false;
});

您可以在 .test 选择器上执行单击事件。并且在单击函数事件中，用户具有类jquery函数，并在每种情况下根据需要进行操作。

编辑：喜欢这个：

$(document).ready(function () {
$(".test").click(function () {
    if($(this).hasClass('red')) {
        var next;
        next = $(this).nextAll(".test");
        $('html, body').animate({
            scrollTop: next.offset().top
        }, "slow");
    } else if($(this).hasClass('blue')) {
        $(this).hide();
    }
    return false;
});
$('.test:last-child').removeClass('red').addClass('blue');

}）;

看看 http://jsfiddle.net/adMYV/4/

相关文章：