加载页面后,只显示javascript提示

时间:2016-11-29 03:56:31

标签: javascript

我们正在github建立战舰游戏。 Battleship

在这里,用户会看到他的船名和位置,根据答案,输出显示在一个名为domsole的文本区域。

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中。 在屏幕上显示任何内容之前,会询问所有提示?如何解决这个问题?

2 个答案:

答案 0 :(得分:1)

  • 将JS脚本标记放在body的末尾是个好习惯,这样就可以先加载所有HTML
  • 浏览器引擎按照它们在文档中出现的顺序加载HTML和JS,但最好取得该加载顺序的所有权。一个可能的事件顺序是:
    • domsole.js已加载。
    • battleship.js已加载。
    • index.html文件准备活动。
    • 游戏从这里开始。

在最后一步之前,不应该执行任何JS代码。因此,请确保在此之前未调用提示。

答案 1 :(得分:0)

您似乎并不了解应用程序的执行流程。除非您再次调用未提及的init函数,否则在加载页面之前无法显示这些问题。在调用init方法之前,输出变量将是未定义的,因此如果在调用init之前调用ask,则会导致javascript错误。看来你错了" loading" for"渲染"。如果要确保在执行代码之前已完成页面呈现,则应使用大约50ms的超时来调用初始化函数。在事件处理完成之后,才会显示对jquery的就绪事件中触发的页面的任何修改。通过在ready事件处理程序中调用setTimeout函数,可以延迟处理,直到完成ready事件处理程序的呈现。