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

Question

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

它显示如下错误：

[TERMINAL]: 无法调用未定义的方法 'add'

TypeError：无法调用未定义的方法“添加” 在 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)

[注意：我删除了上述消息的网站链接！]

它也会为 Safari 输出这个： [TERMINAL]: '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').terminal(function(command, term) {

基本上，我刚刚加载的内容类似于 adva.io，但它是一个带有一点故事情节的在线表单。

我真的不明白为什么我在初始化时遇到问题 :( 错误消息和初始化部分提到的“未定义”部分是什么？

这是jQuery Terminal插件链接：http://terminal.jcubic.pl/api_reference.php

起初我认为调用 jQuery 本身有问题，比如当 jQuery 本身尚未加载时代码可能正在调用 jQuery 函数，但我修复了顺序并在 http://tools.pingdom.com/ 和 jQuery 完全测试了它们的加载在其余 jQuery 脚本初始化之前加载。

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

Answer 1

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

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

Answer 2

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

您可以检查 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

});