jquery ajax加载gif

Question

如何在 jQuery AJAX 处理期间添加加载 gif？我读了一些教程，他们使用 beforeSend。但仍然看不到正在加载的东西。

<script src="jquery-1.6.1.min.js"></script>
<script>
$.ajax({
url: "index_2.php", 
dataType: "html",
type: 'POST', 
data: "value=something",
beforeSend: function () {
    $("#result").html('<img src="loding.gif" /> Now loding...');
},
success: function(data){ 
  $("#result").html(data); //even add .delay(5000)
}
});
</script>
<div id="result"></div>

index_2.php

<?php
sleep(5);
echo $_POST['value'];
?> 

我在index_2.php中设置了sleep(5);，它应该在div#中显示londing.gif result 持续 5 秒，直到数据从 index_2.php 返回。

Answer 1

可能的一个想法是在调用ajax请求之前像您一样加载图像

$("#result").html('<img src="loding.gif" /> Now loding...');

然后成功绑定(bind)数据