Question

解决：

感谢eveyrone试图提供帮助

添加了此代码并且有效：

$(function() {
$( ".itemContainer" ).click(function() {
    $(this).toggleClass( "showtheitem", 800 ),
    $(this).prev(".itemContainer").toggleClass("hide"),
    $(".itemContainer").not(this).prev(".itemContainer").removeClass("hide"),    

     $(".itemContainer").not(this).removeClass("showtheitem");
    return false;
});});

您可以在http://jsfiddle.net/JKnjz/3/

查看其工作原理

我想在点击时将一个类添加到上一个项目，然后再次单击要删除的类。但是如果我点击其他所有项目并将一个类添加到上一个项目中，我也希望删除该类....

将尝试通过代码解释。我有7个divs

<div class="itemContainer">1</div>
<div class="itemContainer">2</div>
<div class="itemContainer">3</div>
<div class="itemContainer">4</div>
<div class="itemContainer">5</div>
<div class="itemContainer">6</div>
<div class="itemContainer">7</div>

CSS：

.itemContainer {float:left;width:100px;height:100px;background:#000;margin:5px;color:#fff}
.hide {display:none;}
.showtheitem {width:200px;height:200px;}

使用Javascript：

$(function() {
    $( ".itemContainer" ).click(function() {
        $(this).toggleClass( "showtheitem", 800 ),
        $(this).prev(".itemContainer").toggleClass("hide"),
         $(".itemContainer").not(this).removeClass("showtheitem");
        return false;
    });
});

因此，例如，如果我单击div编号2，则将“hide”类添加到div no。 1.如果我点击div no。 2它删除了那个隐藏类。那部分还可以。

但如果点击div no我有问题。 2它为div no添加了“hide”类。 1，如果我点击第6号div。 class“hide”仍然存在于div中。没有1。

如果我点击其他所有div，我希望删除类“hide”。

在这里你可以看到它是如何工作的jsfiddle.net/JKnjz/1

我希望我给出明确的例子:)

Answer 1

参考演示链接........，：）

http://api.jquery.com/toggleClass/

Answer 2

我不确定你想要的行为是什么，但删除'hide'类并不是那么难。你可以这样做：

$(function() {
    $( ".itemContainer" ).click(function() {
        $(this).toggleClass( "showtheitem", 800 );
        $('.itemContainer.hide').removeClass('hide');
        $(this).prev(".itemContainer").toggleClass("hide");
        $(".itemContainer").not(this).removeClass("showtheitem");
        return false;
    });
});

关键是在开始隐藏所需的div之前删除所有隐藏项的“隐藏”类。首先取消隐藏所有内容，然后隐藏你想要的那个，只隐藏那个。

任何其他预期的行为，如果您对您想要的内容给出更多解释，那将是最好的......

Answer 3

像桑德一样，我不太明白你的要求。下面是另一种方法，我已经取消了“toggleClass”业务，因为它可能是令人困惑的部分。这听起来像你想要的规则：

一次只能有一个项目showtheitem
项目“{”之前的项目showtheitem应该添加班级hide

如果我理解你的话，这看起来怎么样？

$(".itemContainer").click(function() {
    $(this).siblings('.itemContainer').removeClass('hide');
    $(this).prev(".itemContainer").addClass("hide");
    $('.showtheitem').removeClass('showtheitem');
    $(this).addClass( "showtheitem", 800 );
});

如果我不明白，请发表评论我们会到达那里。

Answer 4

如果我没有误解，你的目标是用户点击项目N：

隐藏项目N-1
显示除N-1

版权？所以答案非常明确：

$(function() {
    $( ".itemContainer" ).click(function() {
        $(".itemContainer.showtheitem").removeClass("showtheitem");
        $(this).toggleClass( "showtheitem", 800 )
        $(this).prev(".itemContainer").toggleClass("hide"),
        return false;
    });
});

Answer 5

这样做

$(function() {
        $( "div.itemContainer").click(function() {
            $prevDiv = $(this).prev('div');
            $prevDiv.toggleClass('hide');
            $prevDiv.siblings().removeClass('hide');
            //return false;
        });
});

jquery toggleClass，removeClass

5 个答案:

DEMO