1

我正在尝试构建一个简单的 Bookmarklet,它将一些外部 Javascript 加载到页面中,目标是将像 Stackoverflow 这样的降价编辑器添加到另一个站点。我让它工作,但它需要我点击我的书签按钮 2 次而不是 1 次。

第一次点击给出了这个错误...

Uncaught ReferenceError: Markdown is not defined init.js:46

第46行是这个...

var converter1 = Markdown.getSanitizingConverter();

现在,在第二次单击我的 Bookmarklet 之后,一切都运行良好,但第一次单击总是会出现该错误并且什么也不做。

这是Bookmarklet文件的代码,请帮我修复,我的Javascript技能不太好。

加载外部 JS 和 CSS 文件

function loadScripts(scriptURL) {
    var scriptElem = document.createElement('SCRIPT');
    scriptElem.setAttribute('language', 'JavaScript');
    scriptElem.setAttribute('src', scriptURL);
    void(document.body.appendChild(scriptElem));
}

// Load these 3 Javascript files into the page
// jQuery is already loaded into the page being used so no need to load it
loadScripts('http://codedevelopr.com/labs/javascript/forrst/Markdown.Converter.js');
loadScripts('http://codedevelopr.com/labs/javascript/forrst/Markdown.Sanitizer.js');
loadScripts('http://codedevelopr.com/labs/javascript/forrst/Markdown.Editor.js');

// Load the CSS file into the Page
var head = document.getElementsByTagName('head')[0];
$(document.createElement('link')).attr({
    type: 'text/css',
    href: 'http://codedevelopr.com/labs/javascript/forrst/demo.css',
    rel: 'stylesheet'
}).appendTo(head);

加载文件后,我们运行这个......

// Find and replace the curent textarea with the HTML we
// need for our markdown editor to work 
$(document).ready(function () {
    var htmlToReplace = ' \
  <div class="wmd-panel"> \
    <div id="wmd-button-bar"></div> \
      <textarea class="wmd-input" id="wmd-input" name="description"></textarea> \
  </div> \
  <div id="wmd-preview" class="wmd-panel wmd-preview"></div>';

    $("#description").replaceWith(htmlToReplace);

    //Run the Markdown editor!
    var converter1 = Markdown.getSanitizingConverter();

    var editor1 = new Markdown.Editor(converter1);
    editor1.run();

});
4

1 回答 1

6

在您使用降价时,您的脚本文件尚未加载。您只是发送了请求。您必须等到收到并解析响应。

我已经清理了你的代码以及你使用 jQuery:

var urls = [
  'http://codedevelopr.com/labs/javascript/forrst/Markdown.Converter.js',
  'http://codedevelopr.com/labs/javascript/forrst/Markdown.Sanitizer.js',
  'http://codedevelopr.com/labs/javascript/forrst/Markdown.Editor.js'
];

// map urls to getScript calls, and pass them to $.when
$.when.apply($, $.map(urls, $.getScript)).then(function() {
  // use markdown here
});

$("<link>", {
  href: 'http://codedevelopr.com/labs/javascript/forrst/demo.css',
  rel: 'stylesheet'
}).appendTo("head");
于 2012-06-12T22:37:53.970 回答