Jquery Ajax加载div未显示

我有以下代码，我不明白为什么加载的gif没有显示。

loadingDiv

最初隐藏在我的样式表中。ajaxStart和ajaxStop函数应该位于dom就绪的内部还是外部

<div id="loadingDiv">
        <img src="images/ajax-loader.gif" alt="" />
</div>
<div id="ajaxLoad"></div>
<script type="text/javascript">
    $(document).ready(function() {
        $('#loadingDiv').hide().ajaxStart( function() {
             $(this).show();  // show Loading Div
         }).ajaxStop(function(){
                $(this).hide(); // hide loading div
           });
        $("#ajaxLoad").load("engine.php");
    });
</script>

$（文档）.ready（函数（）{
$（'#loadingDiv'）.hide（）.ajaxStart（函数（）{
$（this）.show（）；//显示加载Div
}).ajaxStop（函数（）{
$（this.hide（）；//隐藏加载div
});
$（“#ajaxLoad”）.load（“engine.php”）；
});

您所做的是链接到没有ajax进程（加载图像）的错误元素，并更改为

.ajaxComplete（）

尝试以下一种方法：

<script type="text/javascript">
        $(document).ready(function() {
            $('#loadingDiv').hide()
            $("#ajaxLoad").ajaxStart( function() {
                 $('#loadingDiv').show();  // show Loading Div
            }).ajaxComplete(function(){ // <--------------try with .ajaxComplete
                  $('#loadingDiv').hide(); // hide loading div
            });
            $("#ajaxLoad").load("engine.php");
         });
</script>

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

            $('#loadingDiv').hide();

            $(document).ajaxStart( function() {
                 $('#loadingDiv').show();  // show Loading Div
            }).ajaxComplete(function(){ // <--------------try with .ajaxComplete
                  $('#loadingDiv').hide(); // hide loading div
            });
            $("#ajaxLoad").load("engine.php");
         });
</script>

$（文档）.ready（函数（）{
$（'#loadingDiv'）.hide（）
$（“#ajaxLoad”）.ajaxStart（函数（）{
$（'#loadingDiv'）.show（）；//显示加载Div
}).ajaxComplete（function（）{/使用下面的代码，如果您缺少某些内容，则可以在此处使用这些代码：

<script type="text/javascript">
        $(document).ready(function() {
            $('#loadingDiv').hide()
            $("#ajaxLoad").ajaxStart( function() {
                 $('#loadingDiv').show();  // show Loading Div
            }).ajaxComplete(function(){ 
                  $('#loadingDiv').hide(); // hide loading div
             }).load("engine.php");
         });
</script>


$（文档）.ready（函数（）{
$（'#loadingDiv'）.hide（）
$（“#ajaxLoad”）.ajaxStart（函数（）{
$（'#loadingDiv'）.show（）；//显示加载Div
}).ajaxComplete（函数（）{
$（'#loadingDiv'）.hide（）；//隐藏加载div
}).load（“engine.php”）；
});
您正在名为“ajaxLoad”的div内进行AJAX调用，但您正在“loadingDiv内设置ajaxStart/ajaxStop事件div。这些AJAX事件永远不会以这种方式触发。您需要将AJAX事件处理程序从加载div附加到父div，以便它们冒泡，或者在设置ajaxStart/ajaxStop事件的同一个div中进行调用

查看以下页面以了解更多信息：




您正在调用
#ajaxLoad
元素上的
ajaxStart
，因此
$（此）
不会指向
#loadingDiv
。尝试此操作后，它不会显示加载gif，这似乎是同一个问题。@BenPaton您正在使用的jQuery版本。@NOX可能是您看到了我复制/粘贴的代码，并且没有将
$（此）
更改为
$（“#loadingDiv”）
。这一理论听起来不错，但我无法让代码正常工作。我有一个pagewrapper的父div，我应该在此上附加ajax事件吗？