Question

因此，我正在编写一个非常基本的文本编辑器，它允许用户执行某些操作，例如更改文本颜色，使其变粗或应用标题样式。

我遇到的第一个问题是，在文本中选择一个单词并对其应用粗体将使其在我执行替换时应用于字符串中该单词的第一个实例，我需要能够替换通过索引选择实际项目，而不是直接替换单词。

其次是我可以在div中设置标签以供用户输入（单击BOLD按钮，用户将输入并且其设置过于粗体等，标准的wysiwyg行为？）

我的小提琴就在这里：http://jsfiddle.net/d7uvvywu/12/

我道歉，我是jQuery的初学者。

我的文字替换方法。

var span = '<'+htmlCon+'>' + highlight + '<'+htmlCon+'>';
var text = $('#textRegions_1__Text1').html();
$('#textRegions_1__Text1').html(text.replace(highlight, span));

Answer 1

您需要完成的工作不是获取所选文本，而是获取所选索引的开始和所选索引的结束。

从文本框（文本区域）中获取选择已经在这里得到了很好的讨论：How to get selected text from textbox control with javascript

Answer 2

所以，由于这是一个可编辑的div，这个帖子中的其他答案对我没有用，我最终得到了所选文本的索引：

  var textComponent = document.getElementById('editer1');
  var selectedText;
  var range = window.getSelection().getRangeAt(0);
  var beforeSelectedRange = range.cloneRange();
  beforeSelectedRange.selectNodeContents(textComponent);
  beforeSelectedRange.setEnd(range.startContainer,range.startOffset);
  var startIndex = range.startContainer;
  var start = beforeSelectedRange.toString().length;
  var end = start + range.toString().length;

jQuery选择并替换div中的文本

2 个答案: