简体   繁体   English

HTML5如何从文本区域中获取选定的文本

[英]HTML5 how to get selected text out of a textarea

I was able to get the highlighted text out of a textarea by recording onselect and storing the beginning and end each time. 通过记录onselect并存储每次开始和结束,我能够从文本区域中获取突出显示的文本。 Then, when I click a button, I build the substring myself. 然后,当我单击按钮时,我将自己构建子字符串。 Isn't there a simpler way of simply querying the selection? 没有简单的查询选择的简单方法吗?

I was kind of expecting that there would be methods in html5 dom for all these things, something like: 我有点期待html5 dom中的所有这些方法,例如:

textarea.getSelectedStart() textarea.getSelectedEnd(); textarea.getSelectedStart()textarea.getSelectedEnd(); textArea.setSelected(start,end); textArea.setSelected(开始,结束);

Also, is there a way of programmatically deselecting text in a textarea? 另外,有没有一种方法可以以编程方式取消选择文本区域中的文本?

I am putting in code based on the first solution below. 我将基于以下第一个解决方案添加代码。 This sort of works, but has a weird problem: 这种工作,但是有一个奇怪的问题:

<script language=javascript>
function replaceCLOZE(code, questionType) {
  var v = code.value;
  var s = code.selectionStart;
  var e = code.selectionEnd;
  var t = v.substr(s, e-s);
  var rep = "{:" + questionType + ":="+t+"}";
  code.value = v.substr(0,s) + rep + v.substr(e,v.length-e+1);
}

function shortAnswer(code) {
  replaceCLOZE(code, "SA");
}
function shortAnswerCaseSensitive(code) {
  replaceCLOZE(code, "SAC");
}
function multipleChoice(code) {
  replaceCLOZE(code, "MC");
}

The text area does in fact have attributes code.selectionStart and code.selectionEnd. 实际上,文本区域确实具有属性code.selectionStart和code.selectionEnd。 But the code above, which now works, sets the highlighted text on the screen to be the first word in the textarea. 但是上面的代码(现在可以正常工作)将屏幕上突出显示的文本设置为文本区域中的第一个单词。 Mind you, the selectionStart is still correct, but what is actually highlighted in Firefox is wrong. 请注意,selectionStart仍然正确,但是Firefox中实际突出显示的内容是错误的。

In Chrome it works fine. 在Chrome中可以正常运行。 Maybe this is just a bug in firefox or is there something else which should be done to properly update the textarea visually? 也许这只是firefox中的错误,还是需要做其他事情才能以视觉方式正确地更新文本区域?

Following is simple way to get selected text of textarea of html. 以下是获取html文本区域的选定文本的简单方法。 Still not clear what you want as following method simply will give you selected text in alert. 仍然不清楚您想要什么,因为以下方法只会使您选择的文本处于警报状态。

<html><head>
<script>
function alertme(){
var textarea = document.getElementById("textArea");  
var selection = (textarea.value).substring(textarea.selectionStart,textarea.selectionEnd);
alert (selection);
}

</script>

</head>
<body> 
<p><textarea class="noscrollbars" id="textArea"></textarea></p>
<button onclick="alertme()">Click me</button>
</body></html>

When you select text, the button will alert you what you have selected. 选择文本时,该按钮将提醒您选择的内容。 selectionStart gives you starting point and selectionEnd gives you end point, while substring needs three arguments string, starting point and ending point. selectionStart为您提供起点,selectionEnd为您提供终点,而substring需要三个参数字符串,即起点和终点。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM