div在jQuery完成後不會淡出

#cal div在jQuery完成後不會淡出。div在jQuery完成後不會淡出

<div id="main"> 
    <div id="price"></div> 
    <div id="cal">Calculating...</div> 
</div>

這裏是我的Javascript/jQuery代碼：

<script type="text/javascript"> 
    $('#cal').hide(); 
    $('#price_submit').click(function() { 
     var my_data = { 
      //successfully sends data 
     }; 

     $('#price').fadeOut('fast', function(){ 
      $('#cal').fadeIn(); 
     }); 

     $.ajax({ 
      url: "proccess.php", 
      type: 'POST', 
      data: my_data, 
      success: function(msg){ 
       $('#cal').fadeOut('fast', function() { 
        $('#price').fadeIn().html(msg); 
       }); 
      } 
     }); 
     return false; 
    }); 
</script>

最後將成功地檢索數據並顯示它，但它仍然顯示#cal DIV波紋管的價格。我會很感激你的幫助。

來源

2013-06-21 Zim3r

難道是因爲您的fadeIn（）在您的Ajax調用完成時尚未完成？所以對fadeOut（）的調用注意到淡入淡出已經在進行中，並被忽略？ – samjudson

你確定ajax調用成功 –

檢查你的ajax是否響應 –

我會建議你停止以前的動畫和看：

$('#cal').stop().fadeOut('fast', function() { 
    $('#price').stop().fadeIn().html(msg); 
});

來源

2013-06-21 11:25:58

謝謝，但是這種方式沒有任何反應，它不顯示加載程序，但我似乎停止在褪色中。 – Zim3r

.stop（false，true）; –

這樣它只顯示#cal div。 – Zim3r

我剛纔把你的代碼

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

$('#price_submit').click(function() { 
    var my_data = { 
    //successfully sends data 
    }; 

    $('#price').fadeOut('fast', function(){ 
    $('#cal').fadeIn(); 
    }); 
    $.ajax({ 
    url: "/echo/json", 
    type: 'POST', 
    data: my_data, 
    success: function(msg){ 
     msg = '1134141234'; 
     $('#cal').fadeOut('fast', function() { 
      $('#price').fadeIn().html(msg); 
     }); 
     } 
    } 
); 
    return false; 
});

上

http://jsfiddle.net/pfpqv/和它工作得很好。

你能再給一些信息來正確地重現這個問題嗎？

來源

2013-06-21 11:37:12

div在jQuery完成後不會淡出

回答

相關問題