1

我有以下代码用于使用 javascript 突出显示 html 文本：

var counter = 1;
function BindEventForHighlight() {
   $('#ParaFontSize').bind("mouseup", HighlightText);
   $('#ParaFontSize').unbind("mouseup", RemoveHighlight);
}


function UnBindHighlightEvent() {
   $('#ParaFontSize').bind("mouseup", RemoveHighlight);
   $('#ParaFontSize').unbind("mouseup", HighlightText);
}


function HighlightText() {

   var text = window.getSelection();
   var start = text.anchorOffset;
   var end = text.focusOffset - text.anchorOffset; 

   range = window.getSelection().getRangeAt(0);
   range1 = window.getSelection().toString();
   var selectionContents = range.extractContents();
   var span = document.createElement("span");

   span.appendChild(selectionContents);

   span.setAttribute("id", counter);
   span.setAttribute("class", "highlight");
   range.insertNode(span);
   counter++;

}

function RemoveAllHighlights() {
  var selection = document.getElementById('ParaFontSize');
  var spans = selection.getElementsByTagName("span");
  for (var i = 0; i < spans.length; i++) {
      spans[i].className = ""; 
  }
}

function RemoveHighlight() {
   var selection = window.getSelection();
  if (selection.toString() !== "" &&
           selection.anchorNode.parentNode.nodeName === "SPAN") {
     selection.anchorNode.parentNode.className = "";
  }
  else {
     return false;
  }
}

HighlightText 函数使用范围对象来突出显示文本。我想将所选文本的开始和结束保存到数据库中，当用户返回同一页面时，他将看到上一次突出显示的文本。我还想要其他场景如下：

  1. 当用户突出显示某些文本时，他将能够取消突出显示所有或部分突出显示的文本并保持剩余的文本突出显示。

  2. 用户能够清除页面中所有突出显示的文本。

假设我想要这个荧光笔作为 MS word 中的荧光笔。

提前感谢真的很感激。

4

0 回答 0