未執行AJAX / XMLHttpRequest調用之前的代碼行

Question

這是我在Javascript中擁有的以下代碼：

document.getElementById("button").disabled = true;
document.getElementById("button").innerHTML = "Please Wait...";

var xhttp = new XMLHttpRequest();
xhttp.open("GET", "MoodInput"+ "?moodValue=" + input, false);
xhttp.send();

當我將表單提交到Servlet時，似乎首先執行xhttp.send（）函數。 但是，我希望首先執行以下兩行：

document.getElementById("button").disabled = true;
document.getElementById("button").innerHTML = "Please Wait...";

我該怎么辦才能解決問題？ 它必須是同步的，因為servlet中有一個thread.sleep方法，以便Arduino與Serial Port連接並進行設置。

Answer 1

當JavaScript函數運行時，瀏覽器根本不會做很多事情，這包括重新繪制DOM。

您的代碼按照您想要的順序運行，並且DOM正在更新，只是頁面沒有被所做的更改重新繪制。

它必須是同步的

不建議使用同步XMLHttpRequest，因為它們會導致瀏覽器在等待響應時鎖定。 即因為它們導致您遇到的問題。

因為servlet中有一個thread.sleep方法，以便Arduino與串行端口連接並進行設置。

使用同步或異步請求不會受到影響。

您可能希望在收到響應后運行其他一些您在問題中遺漏的JS 。

如果是這樣，真正的解決方案是在請求完成后采取您想做的所有事情，然后將其移至您指定為XHR對象的裝入事件處理程序的函數。

Answer 2

button input type="button"不使用innerHTML作為它使用value的文本：

document.getElementById("button").value = "Please Wait...";

您正在使用輸入或按鈕元素嗎？