在文本区域中显示突出显示的文本

Question

我实现了一个代码，当我突出显示一个单词或短语时，它会添加到文本区域中，但是当我单击鼠标时，突出显示的文本值就会从文本区域中消失。

我正在使用Angularjs实现这一点。

This is my HTML & Angularjs code:


<div ng-app="myApp" ng-controller="caseCtrl">
<form name="aform" >
<textarea id="sel" rows="5" cols="20"></textarea>
</form>
 <div>
  <p>highlight the text to paste it in textbox.</p>
</div>
</div>

<script>
var app = angular.module('myApp', []);
app.controller('caseCtrl', function($scope) {
 function getSelectionText() {
    var text = "";   
   if ((activeElTagName == "textarea")) {        
    } else if (window.getSelection) {
        text = window.getSelection().toString();
    }
  return text;
  }

  document.onclick = function() {
    document.getElementById("sel").value = getSelection();
       };
         });
    </script>

当我突出显示文本时，它将粘贴在文本框中，但是当我单击鼠标时，文本将从文本框中消失。 建议我怎么办？

Answer 1

对于您而言，当您单击某个位置时，所选文本不再存在，因此text值将更新为""空白字符串。 您将必须为此检查。

您的函数应如下所示 ：

var text2 = "";
function getSelectionText() {
    var text = "";   
    if (window.getSelection) {
        text = window.getSelection().toString();
        console.log(text.length);
        if(text.length!=0) {
            text2 =text;
        }
    }
    return text2;
}

document.addEventListener("click", function() {
    document.getElementById("sel").value = getSelectionText();
});