Question

我在这个jquery处理程序中执行squence有一个很大的问题：想知道是否有人在此之前遇到过这个问题：

我有一个简单的表格：

<form action='foo.cgi' id='myForm' >
<input type=text name='name' />
<input type=submit value='Find it!'/>
</form>

当用户点击查找它时！想要在通过ajax调用返回数据之前将光标更改为“progress”：

    $(document).ready(function(){

  $("#myForm ").submit(function(){

   $("body").css("cursor", "progress") ;

   htmlobj=$.ajax({url:server_url,..........);

   }

 }

但是：光标[上面的第2行]在通过ajax返回数据之前不会改变 - 看起来像第3行。在2之前执行。

非常感谢任何帮助

Answer 1

试试这个

$(document).ready(function(){
      //This will be called when your ajax start
     $("body").ajaxStart( function(){
           $(this).css("cursor", "progress") ;
     });

     //this will be called once ajax stop
     $("body").ajaxStop(function(){
         $(this).css("cursor", "pointer") ;
     });

    $("#myForm ").submit(function(){

           htmlobj=$.ajax({url:server_url,..........);
    });

});

Answer 2

我认为只是该页面没有机会更新，因为它正在忙着处理ajax调用。

您可以将ajax调用移动到超时函数中，以便光标更新有机会执行。像

这样的东西

$(document).ready(function(){

  $("#myForm ").submit(function(){

   $("body").css("cursor", "progress") ;
   setTimeout(performAjax,100);

   }

 }

function performAjax() {
    htmlobj=$.ajax({url:server_url,..........);
}

jquery事件处理程序内的执行序列

2 个答案: