1

我有一个没有页面更改的 html 网站。它只是使用 ajax 调用将不同的元素加载到页面上的每个位置。我需要在第一次加载页面后运行登录功能（因为它需要索引上的元素存在），但是当我使用 $(document).ready(login) 时，它会在每次加载元素时触发（因为它将元素加载到页面上，它陷入了无限循环）。除了将它放在我的索引页面的底部（这看起来很脆弱）之外，有没有办法让它在索引页面完成加载后加载，但不是每次 ajax 请求向页面添加内容时都运行它？

我的登录功能如下所示：

function login ()
{
    if($.cookie('employee'))
        employee = $.cookie('employee');

    if(employee && !employee.login)
        $("div.middle").load('login.html');
    else
            $("div.middle").load('main.html');

}

function logout ()
{
    //FIXME send a logout request to server to end session also
    employee = null;
    $.cookie('employee', null);
    $("div.middle").load('login.html'); 
}

我最初的准备函数看起来像：//全局变量 var employee = new Object;

$(document).ready(function(){
        $("div.leftColumn").html(buildLeftNav());
        //set height of middle if height of leftColumn is less than height of middle
        if($("div.leftColumn").css('height') < $("div.middle").css('height'))
            $("div.center").css('height' , $('div.middle').css('height'));




        //handle login and logout
        $.cookie.json = true;
        login();


    });

我设置了一个小提琴来说明：http: //jsfiddle.net/uZVP4/

4

4 回答 4

8

您的问题可能不在于document.ready您可能在 AJAX 调用中一遍又一遍地加载相同的脚本。由于脚本会自动加载新内容，因此它会创建一个无限循环的加载新内容，这会导致新内容再次加载……一遍又一遍。

如果您必须将脚本保存在远程页面中，您可以使用$.get它不会在 ajax 内容中执行脚本

于 2013-01-27T00:03:37.570 回答
2

通常$(document).ready()每页只调用一次。

如果你想要一个“hacky”解决方案，你可以设置一个变量

var wasReady = false;

并将$(document).ready()该值设置为trueif it is false，否则什么也不做。

$(document).ready(function(){
if(!wasReady)
 wasReady = true;
else return;
...
}

我通常使用

$(function(){
 /* code here */
});

这与准备好文档相同，但如果您想在所有页面加载（包括图像）后执行 javascript，请使用

$(window).load(function(){ 
 /*code here */
});
于 2013-01-26T23:46:16.123 回答
1

使用“.one”为我们“解决”了这个问题 

$(document).one("ready", function () {
   // code
});
于 2014-02-07T19:10:48.220 回答
0

你应该试着把它放在body标签的onload中，把它放在这里只在每次提交表单时运行。

....
<body onload="login()">
....
于 2013-01-26T23:46:45.713 回答