页面重新加载有时不显示按钮

so right now I'm making a dashboard side-menu that collapse-able and reopen-able. Everything works great, except for one issue. Let's say I collapsed my side-menu, and then start pressing the refresh page over and over, at a speed of about 1 click/sec. About 2/10 of those page reloads will not show up with the button that is supposed to be there. Here's what I got:

所以现在我正在制作一个可以折叠并重新打开的仪表板侧面菜单。除了一个问题,一切都很好。假设我折叠了我的侧边菜单,然后开始一遍又一遍地按下刷新页面,速度约为1次/秒。大约2/10的页面重新加载将不会显示应该在那里的按钮。这是我得到的:

$(document).ready(function () {
    $("#home").click(function () {
        "use strict";
        $.cookie('open', false);
        $(this).hide();
        $("#home2").show();
        $("#nav").slideToggle('fast');
        $(".content").animate({marginLeft: "0px"}, 200, function () {});
        $(".content").animate({width: "100%"}, 200, function () {});
    });

    $("#home2").click(function () {
        "use strict";
        $.cookie('open', true);
        $(this).hide();
        $("#nav").slideToggle('fast');
        $("#home").show();
        $(".content").animate({marginLeft: "220px"}, 200, function () {});
        $(".content").animate({width: "100%"}, 200, function () {});
    });

    if ($.cookie('open') === 'false') {

        $("#nav").slideToggle('fast');
        $(".content").animate({marginLeft: "0px"}, 1, function () {});
        $(".content").animate({width: "100%"}, 1, function () {});
        $.cookie('open', false);
        $("#home").hide();
        $("#home2").show();
    }
});

I used cookies to get the state of whether the sidebar menu was up. When the cookie open == false, then the sidebar is closed, and when cookie open == true, then it is opened.

我使用cookies来了解侧边栏菜单是否已启动的状态。当cookie打开== false时,侧边栏会关闭,当cookie打开== true时,它会被打开。

To give more detail, the ID "home2" is the one that is not showing up some of the times.

为了提供更多细节,ID“home2”是一些在某些时候没有出现的ID。

Whenever I do a page reload, there's a couple of milliseconds where I can see the

每当我重新加载页面时,我都可以看到几毫秒

    $("#nav").slideToggle('fast');
    $(".content").animate({marginLeft: "0px"}, 1, function () {});
    $(".content").animate({width: "100%"}, 1, function () {});

stuff doing its work. Whenever that happens, the button will show up. But sometimes on the page reloads, the page doesn't do this and it just reloads lightning fast where I can't see the previously mentioned code doing its job; this is when the #home2 button decides not to pop up, which leads me to believe that the stuff in statement is not being performed.

做其工作的东西。只要发生这种情况,按钮就会显示出来。但有时在页面重新加载,页面不会这样做,它只是快速重新加载闪电,我无法看到前面提到的代码完成它的工作;这是#home2按钮决定不弹出的时候,这让我相信声明中的东西没有被执行。

This is such a bizarre problem and I have no idea why it's behaving like this..

这是一个奇怪的问题,我不知道它为什么会这样。

EDIT: Changed if statement around to:

编辑:更改if语句到:

if ($.cookie('open') === 'false') {
    $("#home2").show();
    $("#home").hide();
    $(".content").animate({marginLeft: "0px"}, 1, function () {});
    $(".content").animate({width: "100%"}, 1, function () {});
    $.cookie('open', false);
    $("#nav").slideToggle('fast');
}

Still having same problem.

还有同样的问题。

2 个解决方案

#1

One option is to do this later in the page cycle by using

一种选择是在页面循环中稍后使用

$(window).load(function(){ 
    //my code here 
});

instead of the document ready; what does that do here? api.jquery.com/ready

而不是准备好文件;这是做什么的? api.jquery.com/ready

#2

Possible chances may be slow net connectivity.

可能的机会可能是网络连接速度缓慢。

Or else script is not loaded properly at time of refresh.

否则在刷新时脚本未正确加载。

Cache may also become obstacle for the given problem.

缓存也可能成为给定问题的障碍。

#1