Question

我发现这个小提琴（http://jsfiddle.net/m6aRW/109/）完全符合我的需要。但是，如何更改它以便在页面加载时打开#div1？只需使用display：block即使你点击其他div也会保持div打开。

＆＃13;

jQuery(function ($) {
    $('.showSingle').click(function () {
        var itemid = '#div' + $(this).attr('target'); //id of the element to show/hide.

        //Show the element if nothing is shown.
        if ($('.active').length === 0) {
            $(itemid).slideDown();
            $(itemid).addClass('active');

            //Hide the element if it is shown.
        } else if (itemid == "#" + $('.active').attr('id')) {
            $('.active').slideUp();
            $(itemid).removeClass('active');

            //Otherwise, switch out the current element for the next one sequentially.
        } else {
            $('.active').slideUp(function () {
                $(this).removeClass('active');
                if ($(".targetDiv:animated").length === 0) {
                    $(itemid).slideDown();
                    $(itemid).addClass('active');
                }
            });
        }
    });
});

＆＃13;

.targetDiv {
    display: none
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<a class="showSingle" target="1">Div 1</a>

<a class="showSingle" target="2">Div 2</a>

<a class="showSingle" target="3">Div 3</a>

<a class="showSingle" target="4">Div 4</a>

<div id="div1" class="targetDiv">Lorum Ipsum1</div>
<div id="div2" class="targetDiv">Lorum Ipsum2</div>
<div id="div3" class="targetDiv">Lorum Ipsum3</div>
<div id="div4" class="targetDiv">Lorum Ipsum4</div>

＆＃13;

Answer 1

您可以触发第一个showSingle元素点击事件：

$('.showSingle:first').trigger('click');

http://jsfiddle.net/m6aRW/110/

Answer 2

如果您希望在加载页面时默认显示div，请将active类添加到div1并将css更改为

.targetDiv:not(.active) {
   display: none
}

如果您希望在页面加载后向下滑动，而是添加一些jQuery来执行此操作

$(document).ready(function() { $("#div1").trigger("click"); });

Answer 3

在这里你拥有它！

$( document ).ready(function() {
   $("#div1").slideDown();
   $("#div1").addClass('active');
});

http://jsfiddle.net/m6aRW/111/

如何更改此jquery小提琴默认情况下第一个div打开/活动？

3 个答案: