$(document).ready 与 jQuery

Question

我用 jquery 编码。我的问题是：

<script type="text/javascript">
$(document).ready(function() {
function1();
function2();
});
</script>

有时没有功能起作用，有时功能起作用但它们没有按顺序工作！ 功能1：

function getnameCategories1()
{

    var request = new XMLHttpRequest();
    if(i<idCategories.length)
        {
            request.open("GET","http://patisserie-orient.fr/prestashop/prestashop/api/categories/"+idCategories[i]+"?PHP_AUTH_USER="+PHP_AUTH_USER+"&ws_key="+ws_key,true);

            request.onreadystatechange = function()
                {
                    if(request.readyState==4)
                    {
                        //alert("Status2 is  "+request.status);
                        if (request.status == 200 || request.status == 0)
                        {
                            response1  = request.responseXML.documentElement;
                            nameCategories[i] = response1.getElementsByTagName('language')[0].firstChild.data;
                            //alert(nameCategories[i]);
                            $('#im'+i).html(nameCategories[i]);
                            $('#a'+i).show();
                            i++;


                         }
                     }
                }

            request.send();

        }   
    else
        {
            return;
        }

}

函数2：

function getCategories()
{

    var request = new XMLHttpRequest();

    request.open("GET","http://patisserie-orient.fr/prestashop/prestashop/api/categories?PHP_AUTH_USER="+PHP_AUTH_USER+"&ws_key="+ws_key,true);
    request.onreadystatechange = function()
    {
        if(request.readyState==4)
        {
            //alert("Status is:  "+request.status);
            if (request.status == 200 || request.status == 0)
            {
                response  = request.responseXML.documentElement;
                i=0;
                while(response.getElementsByTagName('category')[i]!=undefined)
                    {
                        idCategories[i]=response.getElementsByTagName('category')[i].getAttribute('id') ;
                        //alert(idCategories[i]);
                        i=i+1;
                    }

             }
         }

    }
    request.send();
}

有时即使只是 $(document).ready 中的警告也不起作用

Answer 1

除非您在函数中使用ajax 或setTimeout，否则它们应该按照您放置它们的顺序播放。

$(document).ready 只会在调用您的函数之前等待 DOM 就绪。

如果您想了解更多信息，请提供非工作代码示例。

Answer 2

jQuery 非常棒，因为每个异步请求都会作为 Deferred 对象返回。一旦你掌握了它们的窍门（它们很简单），你就再也不会以同样的方式编写异步请求了。

http://api.jquery.com/category/deferred-object/

简而言之，如果你说：

var x = $.get('/some_url', function(){ //your callback });

x 现在是一个 Deferred 对象。当您的请求完成时，大多数情况下是 .done() 或 .fail()。

你也可以这样做：

var x = $.get('/some_url'); x.done(function(){ //你的回调 });

有一个非常棒的实用程序，叫做 .when()。仔细阅读，这是您所需要的。

Answer 3

正如 Michael Laffargue 所说，除非您使用某种 AJAX 请求，或者在 setTimeout 内执行某些操作，否则您的函数应该以正确的顺序调用。

请记住，jQuery 存在 DOM 状态和 iframe 的错误（查看参考：http://bugs.jquery.com/ticket/10067）。

最好的办法是将 .ready() 回调函数绑定到 DOM，而不是在 iframe 中进行。

另外，请记住，您可以绑定多个 .ready() 回调。 示例：

$(document).ready(
  function(){
    console.log("Hello");
  }
)

$(document).ready(
  function(){
    console.log("world");
  }
)

也许你以错误的顺序绑定你的函数？

问候

Answer 4

这可能不是你的问题，但可能值得一试。

我知道在使用 asp.net updatePanels 时，您需要使用function pageLoad() { // } 而不是$(document).ready( function() { // });

它有其局限性，因为您只能在页面上包含一个 function pageLoad()。

所以在你的情况下：

function pageLoad() {
function1();
function2();
};

Answer 5

您应该等待请求状态 (request.readyState == 4) ，然后调用 function2()。

if(request.readyState==4)
{
    //alert("Status2 is  "+request.status);
    if (request.status == 200 || request.status == 0)
    {
        response1  = request.responseXML.documentElement;
        nameCategories[i] = response1.getElementsByTagName('language')[0].firstChild.data;
        //alert(nameCategories[i]);
        $('#im'+i).html(nameCategories[i]);
        $('#a'+i).show();
        i++; 


     }
   function2();
 }