编辑剪辑插件不粘贴确切的 html

Question

我尝试在 Redactor 中使用 剪辑插件。

我的需求是：使用 Twitter Bootstrap 语法/类创建一些模板。

---

我创建了这个剪辑：

<li>
  <a href="#" class="redactor_clip_link">Template 2 Colunas</a>

  <div class="redactor_clip" style="display: none;">
    <div class="row">
      <div class="span4">
        <h2>Digite o titulo aqui</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa, sequi ea rerum minima dolor ratione cumque vero repellendus ipsam! Porro, quasi repellat modi. Doloremque, quis, error neque molestias fugit natus modi ducimus? Error, tenetur, rerum debitis ipsa aspernatur sed sequi.</p>
      </div>
      <div class="span5">
        <h2>Digite o titulo aqui</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa, sequi ea rerum minima dolor ratione cumque vero repellendus ipsam! Porro, quasi repellat modi. Doloremque, quis, error neque molestias fugit natus modi ducimus? Error, tenetur, rerum debitis ipsa aspernatur sed sequi.</p>
      </div>
    </div>
  </div>
</li>

但是当插件尝试粘贴代码时……结果是：

<div class="row">
    <div class="span4">
        <h2>Digite o titulo aqui</h2>
        <p>
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa, sequi ea rerum minima dolor ratione cumque vero repellendus ipsam! Porro, quasi repellat modi. Doloremque, quis, error neque molestias fugit natus modi ducimus? Error, tenetur, rerum debitis ipsa aspernatur sed sequi.
        </p>
    </div>
    <div class="span5">
        <h2>Digite o titulo aqui</h2>
    </div>
</div>
<p>
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsa, sequi ea rerum minima dolor ratione cumque vero repellendus ipsam! Porro, quasi repellat modi. Doloremque, quis, error neque molestias fugit natus modi ducimus? Error, tenetur, rerum debitis ipsa aspernatur sed sequi.
</p>

如你所见，</h2> clips 插件关闭后，上面所有的div，然后把`

'。

为什么？

---

剪辑功能

  insertClip: function(html)
  {
    this.selectionRestore();
    this.insertHtml($.trim(html));
    // this.insertHtmlAdvanced($.trim(html)); // doesn't work
    this.modalClose();
  }

---

编辑器配置

  $('#PageDescription').redactor({
    minHeight: 300,
    plugins: ['clips'],
    convertDivs: false,
    lang: 'pt_br',
    deniedTags: ['h1'],
    buttons: ['html', '|', 'formatting', '|', 'bold', 'italic', 'deleted', '|', 'unorderedlist', 'orderedlist', 'outdent', 'indent', '|', 'image', 'video', 'file', 'table', 'link', '|', '|', 'alignment', '|', 'horizontalrule'],
    imageUpload: '/admin/pages/upload_image',
    fileUpload: '/scripts/file_upload.php',
    keyupCallback: function (obj, event) {
      var max = $('#PageDescription').prop('maxlength');
      if (typeof max !== "undefined" && max > 0) {
        var current = obj.currentTarget.innerText.length;
        var $box = $('#PageDescription').parent(".redactor_box");
        var $redactor_indicator = $(".redactor_indicator", $box);
        if ($redactor_indicator.size() === 0) {
          $box.append($("<div class='redactor_indicator'><span class='current'>" + (current - 3) + "</span> of <span class='max'>" + max + "</span> caracteres restantes</div>"));
        } else {
          $(".current", $redactor_indicator).text(current - 3);
          $(".max", $redactor_indicator).text(max);
        }
        if (current >= max) {
          $box.css("border", "1px solid #ff0000");
          $redactor_indicator.css("color", "#ff0000");
        } else {
          $box.css("border", "1px solid #DDDDDD");
          $redactor_indicator.css("color", "#000000");
        }
      }
    }
  });

Answer 1

问题出在insertHtml() API 函数上。

当我使用set() 函数时，一切正常。

  insertClip: function(html)
  {
    this.selectionRestore();
    this.set($.trim(html)); // <---- change insertHtml() to set()
    this.modalClose();
  }