Question

我有这个代码使div滑动打开和关闭，问题是我希望它默认打开。

$(document).ready(function () {
    $('.slider').each(function () {
        var current = $(this);
        current.attr("box_h", current.height());
    });
    $(".slider").css("height", sliderHeight);
    $(".slider_menu").html('<a href="javascript:void(0)">More <img src="images/more_down.gif" border="0"></a>');
    $(".slider_menu a").click(function () {
        openSlider()
    });
});

function openSlider() {
    var open_height = $(".slider").attr("box_h") + "px";
    $(".slider").animate({
        "height": open_height
    }, {
        duration: "slow"
    });

    $(".slider_menu").html('<a href="javascript:void(0)">Close <img src="images/more_up.gif" border="0"></a>');
    $(".slider_menu a").click(function () {
        closeSlider()
    })
};

function closeSlider() {
    $(".slider").animate({
        "height": sliderHeight
    }, {
        duration: "slow"
    });

    $(".slider_menu").html('<a href="javascript:void(0)">More <img src="images/more_down.gif" border="0"></a>');
    $(".slider_menu a").click(function () {
        openSlider()
    })
};

如何在页面加载后触发它打开？

Answer 1

尝试window.onload = openSlider;

Answer 2

只需在openSlider()

中拨打document.ready即可

$(document).ready(function(){
    $('.slider').each(function () {
                var current = $(this);
                current.attr("box_h", current.height());});     
    $(".slider").css("height", sliderHeight);
    $(".slider_menu").html('<a href="javascript:void(0)">More <img src="images/more_down.gif" border="0"></a>');
    $(".slider_menu a").click(function() { openSlider() });    
    openSlider();      
});

Answer 3

只需将其添加到准备好的功能：

$(document).ready(function(){
    $('.slider').each(function () {
                var current = $(this);
                current.attr("box_h", current.height());});     
    $(".slider").css("height", sliderHeight);
    $(".slider_menu").html('<a href="javascript:void(0)">More <img src="images/more_down.gif" border="0"></a>');
    $(".slider_menu a").click(function() { openSlider() });         
    openSlider();  // <---------here
});

如果没有动画，你可以设置默认的CSS来打开它。

Answer 4

$(".slider_menu a").click(function() { closeSlider() })

添加处理程序

$(".slider_menu a").click()

触发事件。在你的情况下你也可以像上面提到的那样调用openSlider，但是我已经进入了触发器示例，因此您可能知道将来可以以双向方式使用点击。

像你一样在你的代码中动态更改html是没有意义的。但是如果你想以任何理由坚持使用这个解决方案，那么在重新创建html之前首先在'a'上调用unbind，否则你可能会有内存泄漏。

Answer 5

为什么不简单地在$（document）.ready中调用你的函数openSlider！

在加载时触发jQuery函数

5 个答案: