JavaScript 在Html TextArea中获取/设置光标

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript 在Html TextArea中获取/设置光标相关的知识，希望对你有一定的参考价值。

<html>
	<head>
<title>Get/Set Caret in Textarea Example</title>
		<script>
function doGetCaretPosition (ctrl) {

	var CaretPos = 0;
	// IE Support
	if (document.selection) {

		ctrl.focus ();
		var Sel = document.selection.createRange ();

		Sel.moveStart ('character', -ctrl.value.length);

		CaretPos = Sel.text.length;
	}
	// Firefox support
	else if (ctrl.selectionStart || ctrl.selectionStart == '0')
		CaretPos = ctrl.selectionStart;

	return (CaretPos);

}


function setCaretPosition(ctrl, pos)
{

	if(ctrl.setSelectionRange)
	{
		ctrl.focus();
		ctrl.setSelectionRange(pos,pos);
	}
	else if (ctrl.createTextRange) {
		var range = ctrl.createTextRange();
		range.collapse(true);
		range.moveEnd('character', pos);
		range.moveStart('character', pos);
		range.select();
	}
}

function process()
{
	var no = document.getElementById('no').value;
	setCaretPosition(document.getElementById('get'),no);
}

		</script>
	</head>
	<body>
		<textarea id="get" name="get" rows="5" cols="31">Please write some integer in the textbox given below and press "Set Position" button. Press "Get Position" button to get the position of cursor.</textarea>
		<br>

		Enter Caret Position: <input type="text" id="no" size="1" /><input type="button" onclick="process();" value="Set Position">
		<BR>
		<input type="button" onclick="alert(doGetCaretPosition(document.getElementById('get')));"
			value="Get Position">
	</body>
</html>

以上是关于JavaScript 在Html TextArea中获取/设置光标的主要内容，如果未能解决你的问题，请参考以下文章

HTML/Javascript/jquery 函数按钮在 TextArea 中的每一行末尾放置逗号

JavaScript - HTML - Textarea 元素的问题

HTML textarea到javascript并保持换行符

如何在html textarea中打印javascript while循环结果？

在html页面中，比如有个textarea，如果让鼠标禁止选中其中的内容，是用javascript来做吗？

使用 Javascript 将 Textarea 的 MaxLength 设置为 50 [重复]