0

我正在尝试将下拉选择和代码按钮添加到 Javascript 中的 Wordpress 编辑器。

我发现这个网站已经完成了我只是想稍微修改一下代码。您可以在这里看到我在说什么，您可以从下拉列表中选择一种语言，然后单击该站点上的代码按钮。

http://bililite.com/blog/blogfiles/customeditor.html

jQuery(function ($) {
  edButtons.forEach(function (button, index) {
    if (button.display == 'code') {

      // add language pull down menu
      edButtons[index + 1] = { // insert right after the code button
        html: function (idPrefix) {
          return '<select id="' + idPrefix + 'code_language" data-code-target="' + index + '">' + '<option></option>' + // include a blank option
          '<option>' + languages.join('</option><option>') + '</option>' + '</select>';
        }
      };
    }
  });

  var languages = ['html', 'javascript', 'lisp', 'pdf', 'php', 'vb'];
  $('body').on('change', 'select[data-code-target]', function () {
    var lang = $(this).val();
   // edButtons[$(this).data('code-target')].tagStart = lang ? '<code class="language-' + lang + '" >' : '<code>';
    edButtons[$(this).data('code-target')].tagStart = lang ? '<pre><code data-language="' + lang + '">' : '<pre><code>';
  });
});

此代码当前插入的代码是这样的，没有从 dropdwon 中选择语言...

<code></code>

这是当一种语言被定向的时候...

<code data-language="php"></code>

我需要做的就是将其包装在<pre> the above code here </pre>标签中。我可以很容易地在上面的代码中添加开始的前置标记，但我无法添加结束标记，我真的可以从更了解 Javascript 的人那里获得一些帮助

4

1 回答 1

1

您应该能够添加与开始标签非常相似的结束标签。尝试这个：

edButtons[$(this).data('code-target')].tagEnd = lang ? '</pre></code>' : '</code>';
于 2012-09-17T18:50:29.647 回答