jQuery 终端脚本只会在刷新后加载

Question

我试过使用 jQuery 终端插件，起初我认为我的脚本没问题。然后我尝试将它上传到两个免费的虚拟主机进行测试，但我遇到了需要刷新页面才能正常工作的问题。至少对于初始加载，即假设未清除浏览器的网络历史记录，成功访问网页，它将工作。

它显示如下错误：

[终端]: 无法调用未定义

的方法 'add'

TypeError: 无法调用未定义的方法 'add' 在 HTMLBodyElement 处。 (/js/jquery.terminal-src.js:266:30)

at Function.m.extend.each (http://code.jquery.com/jquery-1.11.3.min.js:2:2975)
at m.fn.m.each (http://code.jquery.com/jquery-1.11.3.min.js:2:835)
at jQuery.fn.extend.oneTime (/js/jquery.terminal-src.js:265:25)
at $.extend.$.omap.focus (/js/jquery.terminal-src.js:3640:26)
at null.focus (/js/jquery.terminal-src.js:4152:36)
at js/jquery.terminal-src.js:4264:26
at make_interpreter (/js/jquery.terminal-src.js:2811:17)
at $.fn.terminal (/js/jquery.terminal-src.js:4233:13)
at HTMLDocument.<anonymous> (/js/jquery.terminal-src.js:4336:313)

[注：我把上面留言的网址link去掉了！]

它也只会为 Safari 输出： [终端]：'undefined' 不是对象（正在计算 'jQuery.timer.add'）

显示上述信息后，会出现命令提示符，但使其运行的脚本不起作用。

我意识到问题可能出在初始化脚本的这一部分：

  command_line = $('<div/>').appendTo(self).cmd({
                    prompt: settings.prompt,
                    history: settings.history,
                    historyFilter: settings.historyFilter,
                    historySize: settings.historySize,
                    width: '100%',
                    keydown: key_down,
                    keypress: settings.keypress ? function(e) {
                        return settings.keypress(e, self);
                    } : null,
                    onCommandChange: function(command) {
                        if ($.type(settings.onCommandChange) === 'function') {
                            try {
                                settings.onCommandChange(command, self);
                            } catch (e) {
                                display_exception(e, 'onCommandChange');
                                throw e;
                            }
                        }
                        scroll_to_bottom();
                    },
                    commands: commands
                });
               if (enabled) {
                    self.focus(undefined, true);
                } else {
                    self.disable();
                }

               if (enabled) {
                    self.focus(undefined, true);
                } else {
                    self.disable();
                }

这是最后一部分。似乎 "self.focus(undefined, true)" 引起了问题。

我正在为文档的 'body' 部分加载脚本，如下所示：

 $('body').terminal(function(command, term) {

基本上，我正在加载的内容与 adva.io 类似，但它是一个带有一些故事情节的在线表格。

我真的不明白为什么我在初始化时遇到问题:( 错误消息中提到的 "undefined" 部分和 init 的部分是什么？

顺便说一句，这是 jQuery 终端插件 link：http://terminal.jcubic.pl/api_reference.php

起初我以为 jQuery 本身的调用有问题，就像代码在 jQuery 本身尚未加载时调用 jQuery 函数一样，但我修复了顺序并在 http://tools.pingdom.com/ 和 jQuery 完全加载时测试了它们的加载，然后其余 jQuery 脚本初始化。

我也这样做了，所以我制作的自定义脚本与 jquery.terminal-src.js 在同一个脚本文件中（在整个原始内容之后），只是为了确保我的脚本没有在它之前加载。

Answer 1

您是否尝试过在页面加载完成后使用 jquery.getScript？我知道你说你已经使用一些第三方工具检查了加载顺序，但是如果另一个脚本再次加载 jQuery，你可能会丢失所有附加到 [=23] 的插件=] 附加到该点的变量。

您可以检查 IE 中的 Network tab（或其他浏览器中的类似选项卡）以查看是否发生这种情况。

更新：

尝试以下方法。

$(function() {
  $.getScript( "/js/jquery.terminal-src.js")
    .done(function( script, textStatus ) { // optional
      // success code here
    })
    .fail(function( jqxhr, settings, exception ) { // optional
      // fail code here
    });

  // the rest of your code here

});

Answer 2

如果您在代码后加载了另一个 jquery，那么您可以尝试使用 jQuery.noConflict();

(function($) {
   $('...').terminal(...);
})(jQuery.noConflict());

jQuery 终端脚本只会在刷新后加载

jQuery Terminal script will only load upon refresh and onwards

jquery

jquery-terminal