0

我稍微修改了这篇文章中的代码jQuery div content partial hide, show all以显示/隐藏我页面上的 div 列表。

我仍在学习 jQuery，并试图弄清楚如何修改代码，以便当我打开一个 div 时，它会关闭任何其他打开的。

非常感谢您的帮助。这是我的代码块：

    function setScroll(){
    var slideHeight = 80;
    $(".container").each(function() {
    var $this = $(this);
    var $wrap = $this.children(".wrap");
    var defHeight = $wrap.height();
    if (defHeight >= slideHeight) {
        var $readMore = $this.find(".heading");
        $wrap.css("height", slideHeight + "px");
        $readMore.append("<div id='clickButton' class='expand-div'>Click for More Info</div>");
         $readMore.children("#clickButton").bind("click", function(event) {    
            var curHeight = $wrap.height();      
            if (curHeight == slideHeight) {
                $wrap.animate({
                    height: defHeight
                }, "normal");                
                $(this).removeClass("expand-div").addClass("collapse-div");
                $(this).text("Close");
                $wrap.children(".gradient").fadeOut();          
            } else {
                $wrap.animate({
                    height: slideHeight
                }, "normal");
                $(this).removeClass("collapse-div").addClass("expand-div");
                $(this).text("Click for More Info");
                $wrap.children(".gradient").fadeIn();
            }
            return false;
        });
    }
});
}
4

3 回答 3

1

简单示例 ( jsfiddle ) 演示关闭所有并打开一个。

var divs = $('div.highlander').hide();
var which = divs.length;
$('#cycler').click(function () {
    which += 1;
    if (which >= divs.length) {
        which = 0;
    }
    divs.hide();
    divs.eq(which).show();
});
于 2013-08-15T18:54:06.843 回答
0

罗伊的回答很好。我有另一个你可以做的事情的例子。更通用一点，可能更容易理解。http://jsfiddle.net/sFR6Q/2/

    <button class="show1">show1</button>
    <button class="show2">show2</button>
    <button class="show3">show3</button>
    <button class="show4">show4</button>
    <div class="show1">1</div>
    <div class="show2">2</div>
    <div class="show3">3</div>
    <div class="show4">4</div>

     var divs = $("div")
     $('button').click(function () {
         divs.hide();
         $("div." +  $(this).attr("class")).show();
     });
于 2013-08-15T19:32:01.643 回答
-1

首先关闭所有 div，无论它们是打开还是关闭。然后只需打开您需要的 div。

于 2013-08-15T17:49:08.123 回答