Question

这是一个非常简单的事情，我想做的，在改变功能我希望加载 div是可见的，＆amp;通过ajax请求，我填写了内容。现在的问题是加载 div在更改功能中不起作用，但它在ajax成功函数中工作，我不知道我在哪里犯了我的错误。请看一下我的代码。

<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script>
$(document).ready(function(){
$('#sub').change(function(){
    $('.autoload').empty();
    $('.loading').show(); // Here it doesn't work
    var val=$(this).val();
    $(this).value= val;
    if(val=='One'){
        var sub_cat=11;
    }
    else if(val=='Two'){
        var sub_cat=12;
    }
    else{
        var sub_cat=13;
    }
    var cat_id= <?php echo $cat_id; ?>;
    $.ajax({
        type: "POST",
        url: "ajax_showsubdiv.php",
        data: {cat_id:cat_id,sub_cat:sub_cat},
        success: function(option){
            $('.loading').show(); // Here it's working
            $('.autoload').replaceWith(option);
            flag=false;
        }
    });
    $('.loading').hide();
});
});
</script>

HTML

<div class='autoload'></div>
<div class='loading'>
    <img src='acz.gif'>
</div>

一切正常，数据正常，完全替换，唯一的事情就是需要时间来显示加载div因为它位于成功函数中，所以只有在ajax请求完成后，div才会显示。有人能说出它为什么不起作用吗？

Answer 1

更改函数底部的语句$('loading').hide();正在执行，并在调用$('loading').show();后几乎立即隐藏该元素。由于AJAX是异步，因此浏览器在继续执行之前不会等待$.ajax()调用完成。请尝试删除此声明。

Div不会在更改功能上显示，但在ajax成功时会显示

1 个答案: