为什么我的jQuery-UI脚本不能在Greasemonkey中执行？ 它在Firebug控制台中运行
我已经尝试过相当多的研究，因为这是我的第一个Greasemonkey脚本：
// ==UserScript== // @name Codecademy Resizeable Code // @description Adds jQuery resizable to editor // @namespace http://chrisneetz.com // @include http://www.codecademy.com/courses/* // ==/UserScript== $('#editor').resizable({ alsoResize: ".ace_scroller, .ace_editor, .ace_content, .ace_sb, .ace_print_margin_layer", handles: "n, s" }); 我尝试了Greasemonkey的建议，但我不确定它是否是兼容性问题。 第三方库我把它包装在一个准备好的文档中并没有什么区别，但是当我使用Firebug控制台时，它工作正常。
更新：
我现在建议只使用Google上托管的标准主题之一，忘记尝试从本地副本运行所有内容（ @resource指令的目的和CSS重写，如下所示）。
有关jQuery-UI加载的维护密集度较低的方法，请参阅此答案 。
旧答案（仍然有效）：
Firebug javascript在目标页面范围内执行。
Greasemonkey javascript在受保护且特权的沙箱中执行。
这意味着如果页面加载库，如jQuery和jQuery-UI，Greasemonkey脚本通常不会看到它们。 （有很多方法，但尽可能避免它们。）
在这个问题中，这个链接给出了答案。 由于代码： $('#editor').resizable(...使用jQuery和jQuery-UI，你的脚本必须包含那些库 – 如下所示：
// ==UserScript== // @name Codecademy Resizeable Code // @description Adds jQuery resizable to editor // @namespace http://chrisneetz.com // @include http://www.codecademy.com/courses/* // @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js // @require http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js // @grant GM_addStyle // ==/UserScript== $('#editor').resizable ( { alsoResize: ".ace_scroller, .ace_editor, .ace_content, .ace_sb, .ace_print_margin_layer", handles: "n, s" } );
但是 ，jQuery-UI也大量使用自定义CSS。 让这个CSS与Greasemonkey一起使用有点复杂。 像这样更改脚本，使用CSS，加上2个更好的图标集：
// ==UserScript== // @name Codecademy Resizeable Code // @description Adds jQuery resizable to editor // @namespace http://chrisneetz.com // @include http://www.codecademy.com/courses/* // @require http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js // @require http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js // @resource jqUI_CSS http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css // @resource IconSet1 http://sofzh.miximages.com/javascript/ui-icons_222222_256x240.png // @resource IconSet2 http://sofzh.miximages.com/javascript/ui-icons_454545_256x240.png // @grant GM_addStyle // @grant GM_getResourceURL // @grant GM_getResourceText // ==/UserScript== $('#editor').resizable ( { alsoResize: ".ace_scroller, .ace_editor, .ace_content, .ace_sb, .ace_print_margin_layer", handles: "n, s" } ); /*--- Process the jQuery-UI, base CSS, to work with Greasemonkey (we are not on a server) and then load the CSS. *** Kill the useless BG images: url(images/ui-bg_flat_0_aaaaaa_40x100.png) url(images/ui-bg_flat_75_ffffff_40x100.png) url(images/ui-bg_glass_55_fbf9ee_1x400.png) url(images/ui-bg_glass_65_ffffff_1x400.png) url(images/ui-bg_glass_75_dadada_1x400.png) url(images/ui-bg_glass_75_e6e6e6_1x400.png) url(images/ui-bg_glass_95_fef1ec_1x400.png) url(images/ui-bg_highlight-soft_75_cccccc_1x100.png) *** Rewrite the icon images, that we use, to our local resources: url(images/ui-icons_222222_256x240.png) becomes url("' + GM_getResourceURL ("IconSet1") + '") etc. */ var iconSet1 = GM_getResourceURL ("IconSet1"); var iconSet2 = GM_getResourceURL ("IconSet2"); var jqUI_CssSrc = GM_getResourceText ("jqUI_CSS"); jqUI_CssSrc = jqUI_CssSrc.replace (/url\(images\/ui\-bg_.*00\.png\)/g, ""); jqUI_CssSrc = jqUI_CssSrc.replace (/images\/ui-icons_222222_256x240\.png/g, iconSet1); jqUI_CssSrc = jqUI_CssSrc.replace (/images\/ui-icons_454545_256x240\.png/g, iconSet2); GM_addStyle (jqUI_CssSrc);