发送ajax请求的时候，如果后台暂时没有返回数据，一般会显示一个loading图标来提醒用户当前正在加载中。下面直接上代码，用jquery来操作，很方便。
<!DOCTYPE html> <html lang="en"> <head> <Meta charset="UTF-8"> <title>ajax加载loading图标</title> </head> <body> <form id="test-form" action="test.PHP" method="post"> <input type="text" name="username"> </form> <button id="btn">提交</button> <div id="loading"></div> <div id="res"></div> </body> <script> $('#btn').click(function(){ $.ajax({ url:$('#test-form').attr('action'),//发送后台的url type:'post',data:$('#test-form').serialize(),//序列化表单内容 dataType:'text',//后台返回的数据类型 timeout:15000,//超时时间 beforeSend:function(XMLHttpRequest){ $("#loading").html("<img src='./images/loading.gif' />"); //在后台返回success之前显示loading图标 },success:function(data){ //data为后台返回的数据 $("#loading").empty(); //ajax返回成功，清除loading图标 $('#res').html('ajax请求成功！'); } }); }); </script> </html>
