在webservice运行时显示加载

在对页面的初始请求中，我触发Web服务并希望显示加载消息。 当页面加载完毕后，我想从屏幕上删除等待的消息，但是当复选框中的更改事件触发带有另一个加载消息的Ajax调用时，再次显示它。

此代码不符合给定的规范：

 $（文件）。就绪（
     $（function（）{
      $（ '＃loadingDiv'）隐藏（）。

       $（ '＃productsDropDown'）
          .change（function（）{
             var prodValue = $（this）.val（）;
             $（'＃proddate'）。load（'getpdate.php'，{prod：prodValue}）;
     }）; 

     $（ '＃loadingDiv'）
         .ajaxStart（function（）{
             $（本）.show（）;
         }）
         .ajaxStop（function（）{
             $（本）.hide（）;
         }）    
     ;   
     }）;
 ）;

我究竟做错了什么？

Answer 1

您需要重新排列代码，如下所示：

$(function() { $('#loadingDiv').hide(); $('#productsDropDown').change(function() { var prodValue = $(this).val(); $('#proddate').load('getpdate.php', {prod: prodValue }); }); $('#loadingDiv').ajaxStart(function() { $(this).show(); }).ajaxStop(function() { $(this).hide(); }); }); 

目前你有这个：

 $(document).ready( $(function() { }); ); 

document.ready接受一个函数，你传递一个jquery元素。 $(function() { })相当于将它包装在$(document).ready(function() { }) （ 详见此处 ），无需将其包装两次。

Answer 2

 $(document).ready(function() { var loader = $('#loadingDiv'); loader.hide(); $('#productsDropDown').change(function() { var prodValue = $(this).val(); loader.show(); $('#proddate').load('getpdate.php', {prod: prodValue }, function() { loader.hide(); }); }); );