Question

我尝试过使用jQuery Terminal插件，起初我认为我的脚本没问题。然后我尝试将它上传到两个免费的webhosts进行测试，我遇到了一些问题，你需要刷新页面才能正常工作。至少对于初始加载，即在未清除浏览器的Web历史记录的情况下对网页的后续访问，它将起作用。

它显示如下错误：

[TERMINAL]：无法调用未定义的方法'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)

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

它也会为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”部分的脚本，如下所示：

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

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

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

顺便说一下，这是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

});

jQuery Terminal脚本只会在刷新时加载

2 个答案: