亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

.show() .hide() 和 ajax 調用

.show() .hide() 和 ajax 調用

SMILET 2023-03-03 15:25:15
我的 .cshtlm 表單中有一個 js 函數,我通過按鈕調用它。我的函數隱藏按鈕,顯示進度條,調用 2 個 ajax,隱藏進度條,最后顯示一條消息。JS函數代碼var CustomsBook = function () { var month = $("#month").val(); var message = ""; var errorMessage = ""; $("#btn").hide(); $("#prcs").show(); $("#progressbar").show(); $("#successMessage").empty().hide(); $("#dangerMessage").empty().hide(); $.ajax({  async: false,  url: "/Logistics/jCustomsBookHQ",  type: "POST",  data: { month: month },  success: function (HQresponse) {   if (HQresponse.success) { message += HQresponse.message; }   else { errorMessage += HQresponse.message; }  } }); $.ajax({  async: false,  url: "/Logistics/jCustomsBookBr",  type: "POST",  data: { month: month },  success: function (BRresponse) {   if (BRresponse.success) {    if (message.length > 0) { message += " <br> "; }    message += BRresponse.message;   }   else {    if (errorMessage.length > 0) { errorMessage += " <br> "; }    errorMessage += BRresponse.message;   }  } }); $("#prcs").hide(); $("#progressbar").hide(); $("#successMessage").html(message); if (message.length > 0) {  $("#successMessage").show(); } $("#dangerMessage").html(errorMessage); if (errorMessage.length > 0) {  $("#dangerMessage").show(); }}當我按下按鈕調用函數時,$("#prcs").show();它$("#progressbar").show();不起作用。如果我使用調試器并逐步運行代碼,進度條會在 ajaxs 結束后顯示和隱藏。我嘗試為每個 ajax 編寫 2 個不同的函數,并將 ajax 代碼替換為調用具有相同結果的函數。我想念什么嗎?在此先感謝您的幫助。
查看完整描述

2 回答

?
縹緲止盈

TA貢獻2041條經驗 獲得超4個贊

如果您希望在單擊按鈕后顯示某些內容,并且該按鈕正在觸發 ajax 請求,則將下面的代碼放在括號內success: function (BRresponse) {,而不是放在 ajax 請求之外。


 $("#prcs").hide();

 $("#progressbar").hide();

 $("#successMessage").html(message);

 if (message.length > 0) {

  $("#successMessage").show();

 }

 $("#dangerMessage").html(errorMessage);

 if (errorMessage.length > 0) {

  $("#dangerMessage").show();

 }


查看完整回答
反對 回復 2023-03-03
?
FFIVE

TA貢獻1797條經驗 獲得超6個贊

刪除這個:


async: false,

您的瀏覽器應該在調試控制臺上給您一條警告消息,說明該功能已被棄用。但更重要的是,您明確告訴瀏覽器同步執行異步操作,所有操作都在單個線程上進行。這意味著在所有這些操作完成之前,用戶界面無法更新。


允許您的異步操作是異步的,以便 UI 可以在操作期間更新。在這些操作之后需要發生的任何事情都應該在它們的回調中調用,而不僅僅是放在它們下面的代碼中。


簡而言之,async: false是您不需要、不想要并且應該完全避免的拐杖。無論您嘗試使用它來解決什么問題都沒有解決,它只是被一個新問題掩蓋了。


編輯:特別是在您的代碼中,所有這些都應該在success處理函數中,而不是在調用之后$.ajax():


$("#prcs").hide();

$("#progressbar").hide();

$("#successMessage").html(message);

if (message.length > 0) {

  $("#successMessage").show();

}

$("#dangerMessage").html(errorMessage);

if (errorMessage.length > 0) {

  $("#dangerMessage").show();

}

例如:


$.ajax({

  url: "/Logistics/jCustomsBookBr",

  type: "POST",

  data: { month: month },

  success: function (BRresponse) {

    if (BRresponse.success) {

      if (message.length > 0) { message += " <br> "; }

      message += BRresponse.message;

    } else {

      if (errorMessage.length > 0) { errorMessage += " <br> "; }

      errorMessage += BRresponse.message;

    }

    $("#prcs").hide();

    $("#progressbar").hide();

    $("#successMessage").html(message);

    if (message.length > 0) {

      $("#successMessage").show();

    }

    $("#dangerMessage").html(errorMessage);

    if (errorMessage.length > 0) {

      $("#dangerMessage").show();

    }

  }

});


查看完整回答
反對 回復 2023-03-03
  • 2 回答
  • 0 關注
  • 102 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號