如何防止在选择时清除文本框?
how to prevent unclearing a textbox when selection is made?
我正在尝试构建一个文本编辑器,为此我正在使用文本区域来填充我的文本
我的问题是当我点击一个按钮时文本区域选择消失了。
下面是一些代码来说明问题:
<!DOCTYPE html>
<html>
<body>
Address:<br>
<textarea id="myTextarea">
California Road
</textarea>
<p>Click the button to select the contents of the text area.</p>
<button type="button">Try it</button>
</body>
</html>
如果您想添加 bbcode 功能,您可能需要查看此线程:
jQuery Set Cursor Position in Text Area
此代码(取自此线程 Get the Highlighted/Selected text 中的 Tim Down)也可能有所帮助:
function getSelectionText() {
var text = "";
if (window.getSelection) {
text = window.getSelection().toString();
} else if (document.selection && document.selection.type != "Control") {
text = document.selection.createRange().text;
}
return text;
}
选择并没有丢失,只是当文本区域未获得焦点时不显示。
在 Firefox、Chrome 或 IE10 上尝试此代码:
http://jsfiddle.net/swwqd700/
HTML 部分:
Address:<br>
<textarea id="myTextarea">
California Road
</textarea>
<p>Click the button to select the contents of the text area.</p>
<button id="button">Try it</button>
Javascript 部分:
function go() {
var e = document.getElementById("myTextarea");
var startPos = e.selectionStart;
var endPos = e.selectionEnd;
var selection = e.value.substring(startPos, endPos) ;
alert("It seems to have disappeared, but...\n\"" + selection + "\"");
e.focus();
}
var btn = document.getElementById("button");
btn.addEventListener(
"click",
go,
false
);
我正在尝试构建一个文本编辑器,为此我正在使用文本区域来填充我的文本
我的问题是当我点击一个按钮时文本区域选择消失了。
下面是一些代码来说明问题:
<!DOCTYPE html>
<html>
<body>
Address:<br>
<textarea id="myTextarea">
California Road
</textarea>
<p>Click the button to select the contents of the text area.</p>
<button type="button">Try it</button>
</body>
</html>
如果您想添加 bbcode 功能,您可能需要查看此线程:
jQuery Set Cursor Position in Text Area
此代码(取自此线程 Get the Highlighted/Selected text 中的 Tim Down)也可能有所帮助:
function getSelectionText() {
var text = "";
if (window.getSelection) {
text = window.getSelection().toString();
} else if (document.selection && document.selection.type != "Control") {
text = document.selection.createRange().text;
}
return text;
}
选择并没有丢失,只是当文本区域未获得焦点时不显示。 在 Firefox、Chrome 或 IE10 上尝试此代码: http://jsfiddle.net/swwqd700/
HTML 部分:
Address:<br>
<textarea id="myTextarea">
California Road
</textarea>
<p>Click the button to select the contents of the text area.</p>
<button id="button">Try it</button>
Javascript 部分:
function go() {
var e = document.getElementById("myTextarea");
var startPos = e.selectionStart;
var endPos = e.selectionEnd;
var selection = e.value.substring(startPos, endPos) ;
alert("It seems to have disappeared, but...\n\"" + selection + "\"");
e.focus();
}
var btn = document.getElementById("button");
btn.addEventListener(
"click",
go,
false
);