0

我正在尝试实现一种非常简单的所见即所得的 javascript 编辑器。

我所拥有的：我知道，当前的 Javascript 不能通过点击按钮来工作……</p> 

   wrapText = function(replacementText) {
          var range, sel;
          if (window.getSelection) {
            sel = window.getSelection();
            if (sel.rangeCount) {
              range = sel.getRangeAt(0);
              range.deleteContents();
              return range.insertNode(document.createTextNode(replacementText));
            } else if (document.selection && document.selection.createRange) {
              range = document.selection.createRange();
              return range.text = replacementText;
            }
          }
        };

<a id="bold-btn">Make it Bold!</a>
<div id="editit" contenteditable="true"></div>

现在，如果您在可编辑的 div 中标记/突出显示某些文本并点击使其加粗 - 按钮。选定的文本将被包裹在 <b/> 标记中。

问题是输出看起来像这样：

这是一个带有 <b>bold<b/> 单词的示例文本。

代替：

这是一个带有粗体字的示例文本。

任何想法？

4

1 回答 1

1

你太努力了；）

您的代码正在做的是创建一个文本节点，这意味着内容将是文本而不是被视为 html。您可以只使用execCommand它。

例如，“Make it Bold”只需要调用document.execCommand('bold'). 您可以查看 Mozilla 的execCommand文档以了解更多详细信息。

对于一个非常小的示例，请查看所见即所得的演示，然后查看index.js一些想法，或者自己使用该库。

于 2013-05-16T17:05:45.560 回答