Question

我有两个Divs与流行和其他人，我使用jquery toggleClass为slideUp和Slidedown之间的两个div部分目前它工作正常，但当我点击流行的div它显示流行内容的内容但不改变其两个div的减去加号和加号到负号的图标可以帮助我解决它谢谢！

http://jsfiddle.net/v9Evw/352/

HTML

<div id="popular">

    <div id="headerDivImg1" class="toggle1" id="popular_img" style='background:#4c97d0;height:30px;width:640px;'>
        <span style='color:#fff;padding-left:10px;line-height:30px;'>DIV1</span>
        <a class="toggle1" style='float:right;' id="popular_img" href="javascript:popular('popular_content', 'popular_img');">

        </a>
    </div>
    <div id="popular_content" class="content" style="display: block;">
        <p>welcome to Div1</p>
    </div>

</div>

<br/>

<div id="others">

    <div id="headerDivImg1" id="other_img" class="toggle2" style='background:#4c97d0;height:30px;width:640px;'>
        <span style='color:#fff;padding-left:10px;line-height:30px;'>DIV2</span>
        <a class="toggle2" style='float:right;' id="other_img" href="javascript:popular('popular_content', 'popular_img');">

        </a>
    </div>
    <div id="other_content" class="content" style="display: block;">
        <p>welcome to Div2</p>
    </div>

</div>

JQUERY

$(document).ready(function()
{
    var $content = $("#popular_content").show();
    $(".toggle1").on("click", function(e)
    {
        $(this).toggleClass("expanded");
        $content.slideToggle();
    });
});

$(document).ready(function()
{
    var $content = $("#other_content").hide();
    $(".toggle2").on("click", function(e)
    {
        $(this).toggleClass("expanded");
        $content.slideToggle();
    });
});

CSS

.toggle1
{
    display:inline-block;
    height:27px;
    width:41px;  background:url("minus.png");

}
.toggle1.expanded
{
    background:url("plus.png");
}


.toggle2
{
    display:inline-block;
    height:27px;
    width:41px;  background:url("plus.png");

}
.toggle2.expanded
{
    background:url("minus.png");
}

Answer 1

我认为这可能会有所帮助

<强> HTML

.divcontainer{
    background:aqua;
    width:100%
}

<强> CSS

$(document).ready(function () {
    $('.glyphicon-plus').click(function () {
        $(this).parent("div").find(".glyphicon-plus")
            .toggleClass("glyphicon-minus");
    });
});

<强> Jquery的

{{1}}

JQuery Toggle Class Plus和minus图标问题

1 个答案: