已在頁面加載後顯示javascript提示

我們正在github上構建一個戰艦遊戲。 Battleship 已在頁面加載後顯示javascript提示

在這裏提示用戶，他的名字和他的船的位置，並根據答案，輸出顯示在一個叫做domsole的textarea上。

Domsole = (function($) { 
var output; 

var init = function(outname) { 
    output = $('#'+outname); 
    output.attr('disabled', 'disabled'); 
}; 

var ask = function(question) { 
    write(question); 
    var text = prompt(question); 
    write('> ' + text); 
    return text; 
}; 

var write = function(text) { 
    output.append(text + "\n"); 
    output.scrollTop(9999999999); 
}; 

return { 
    ask: ask, 
    init: init, 
    write: write 
}; 
})(jQuery); 

$(document).ready(function() { 
    Domsole.init('domsole_out'); 
});

但是，在頁面加載之前詢問所有提示。

一些提示的是

this.name = Domsole.ask("What's your name, Playa?"); 

    Domsole.write("Alright, " + this.name + " you shall be."); 
........ 
...... 
     var coord = Domsole.ask("Where would you like to take a shot? Valid input is: x, y");

調用Domsole.write和Domsole.ask也是這些的document.ready代碼。在屏幕上顯示任何內容之前詢問所有提示？如何解決這個問題？

來源

2016-11-29 paris_serviola

那麼你是說你提供的第二個snipplet代碼是調用ask/write方法不在文檔裏面嗎？ @paris_serviola – Taplar

調用ask/write方法的代碼也在文檔準備好了 –

使用window.onload。看到這個問題的答案http://stackoverflow.com/questions/21742867/jquery-ready-vs-window-onload#21742922 – david25272

將您的JS腳本標記放在body的末尾，以便您首先加載所有HTML是個好習慣。
瀏覽器引擎按照它們在文檔中出現的順序加載HTML和JS，但最好取得該加載順序的所有權。一個可能的事件順序是：
- domsole.js已加載。
- battleship.js已加載。
- index.html文檔準備好的事件。
- 遊戲從這裏開始。

沒有JS代碼應該是最後一步之前已經執行。因此，請確保您的提示在此之前未被調用。

來源

2016-11-29 04:07:37 yelsayed

控制腳本加載順序的唯一方法是從字面上添加腳本標記，並可能刪除它們之後從JavaScript以預定義的順序。 HTTP 2.0允許同時加載多個文檔，這意味着這種「技巧」不能保證在未來的瀏覽器中工作。 –

看來你不明白你的應用程序的執行流程。在頁面加載之前，沒有任何可能的方式顯示這些問題，除非您有另一個對init函數的調用，您還沒有提到。在調用init方法之前，輸出變量將是未定義的，因此如果在調用init之前調用ask，則會導致javascript錯誤。似乎你錯誤地「加載」「渲染」。如果您希望確保在執行代碼之前已完成頁面渲染，則應使用大約50ms的超時來調用初始化函數。在事件處理完成之前，對jQuery的就緒事件中觸發的頁面所做的任何修改都不會顯示。通過在ready事件處理程序中調用setTimeout函數，您可以延遲處理，直到完成ready事件處理程序的呈現。

來源

2016-11-29 04:26:21

已在頁面加載後顯示javascript提示

回答

相關問題