警告：Newbe問題。 :-)

使用Ajax，我發送表單數據到MVC3控制器並讓Json回來。JQuery：第二個.html（）調用忽略了以前的.css（），delay（）和fadeIn（）調用

成功時，我想：

存儲原始形式div內容（呼叫.html()）
與JSON結果替換HTML形式div（這是一個字符串 - 「成功「）
延時3秒
替換HTML表單div與原始的HTML
淡入的origi最終形式

這一切正常。但是，當成功html顯示時，它會立即被第二個.html()調用吹掉，該調用將原始表單html重新放回div格式。 .delay(3000)和.css('display','none')之間的調用似乎被忽略。

證明：如果我註釋掉以下代碼行（來自以下源代碼），將顯示成功消息。

$('#frmSignup').css('display', 'none'); 
$('#frmSignup').html(original).fadeIn();

我查找了類似的案例和解決方法，但找不到任何。如果這很明顯，請不要狠狠打敗我。 ;-)

非常感謝您的協助！

源部分：

$（ '形式'）生活（「提交」，函數（事件）{ event.preventDefault（）;

var form = $(this); 
var original = $('#frmSignup').html(); 

$.ajax({ 
    url: form.attr('action'), 
    type: "POST", 
    data: form.serialize(), 
    beforeSend: function() { 
     $('#goarrow').fadeOut(); 
     $('#ajaxloader').fadeIn(); 
    }, 
    complete: function() { 
     $('#ajaxloader').fadeOut(); 
     $('#goarrow').fadeIn(); 
     //$('#Email').val(""); 
    }, 
    success: function (data) { 
     if (data[0]) { 
      $('#frmSignup').css('display', 'none'); 
      $('#frmSignup').html(data[1]).fadeIn().delay(3000); 
      $('#frmSignup').css('display', 'none'); 
      $('#frmSignup').html(original).fadeIn(); 
     } else { 
      $("#ajaxresponse").html(data[1]); 
      //$.validator.unobtrusive.parse("form"); 
     } 
    }, 
    error: function (jqXhr, textStatus, errorThrown) { 
     alert("Error '" + jqXhr.status + "' (textStatus: '" + textStatus + "', errorThrown: '" + errorThrown + "')"); 
    } 
}); 
return false;

}）;

來源

2011-09-09 Steve Jackson

你嘗試鏈接的一切嗎？ jq站點上的所有「延遲」示例都使用鏈接。像'$（'＃frmSignup'）。html（data [1]）。fadeIn（）。delay（3000）.html（original）.fadeIn（）;' – bfavaretto

嗨bfavaretto。是的，我試圖鏈接並得到相同的結果。爲了調試目的，我打破了這些調用，以便輕鬆發表評論。 –

我沒有使用.delay（）一噸的經驗，但你可以只使用setTimeout的

$('#frmSignup').css('display', 'none'); 
$('#frmSignup').html(data[1]).fadeIn(); 
setTimeout(function(){ 
    $('#frmSignup').css('display', 'none'); 
    $('#frmSignup').html(original).fadeIn(); 
},3000);

或者嘗試當您使用延遲每jQuery的文檔鏈接的元素。

也，而不是使用的CSS（「顯示」，「無」），可以使用.hide()

來源

2011-09-09 22:27:39 fehays

謝謝你的回答。它在所有瀏覽器中都很有魅力。 –

我不知道是否有JQuery解決方案。 –

JQuery：第二個.html（）調用忽略了以前的.css（），delay（）和fadeIn（）調用

警告：Newbe問題。 :-)

源部分：

回答

相關問題