社区
JavaScript
帖子详情
如何用JS在多行文本框中光标入插入文字?要求FIREFOX也能正常用
teatool
2005-05-14 05:29:25
RT
...全文
149
3
打赏
收藏
如何用JS在多行文本框中光标入插入文字?要求FIREFOX也能正常用
RT
复制链接
扫一扫
分享
转发到动态
举报
AI
作业
写回复
配置赞助广告
用AI写文章
3 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
孟子E章
2005-05-17
打赏
举报
回复
<script type="text/javascript">
function setCaret (textObj) {
if (textObj.createTextRange) {
textObj.caretPos = document.selection.createRange().duplicate();
}
}
function insertAtCaret (textObj, textFeildValue) {
if(document.all){
if (textObj.createTextRange && textObj.caretPos) {
var caretPos = textObj.caretPos;
caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ?textFeildValue + ' ' : textFeildValue;
}else{
textObj.value = textFeildValue;
}
}else{
if(textObj.setSelectionRange){
var rangeStart = textObj.selectionStart;
var rangeEnd = textObj.selectionEnd;
var tempStr1 = textObj.value.substring(0,rangeStart);
var tempStr2 = textObj.value.substring(rangeEnd);
textObj.value = tempStr1 + textFeildValue + tempStr2;
}else{
alert("This version of Mozilla based browser does not support setSelectionRange");
}
}
}
</script>
<form id="form1" action="" onsubmit="" method="post" enctype="text/plain">
<p>
<textarea name="tarea" rows="" cols="" style="width:300px;height:120px;"
onselect="setCaret(this);"
onclick="setCaret(this);"
onkeyup="setCaret(this);" >例子例子例子例子例子</textarea>
<br/><br/>
<input type="text" name="textfield" style="width:220px;" value="插入FireFox"/>
<br/>
<input type="button" value="插入"
onclick="insertAtCaret(this.form.tarea,this.form.textfield.value);"/>
</p>
</form>
teatool
2005-05-17
打赏
举报
回复
楼上的老大,这段代码在IE里是正常的,但在FIREFOX中就不是插入了,而是把多行文本框的内容全部替换成要插入的文字了
hchxxzx
2005-05-15
打赏
举报
回复
<HTML>
<HEAD>
<SCRIPT>
function storeCaret(textEl)
{
if(textEl.createTextRange)
textEl.caretPos = document.selection.createRange().duplicate();
}
function insertAtCaret(textEl,text){
if(textEl.createTextRange && textEl.caretPos){
var caretPos = textEl.caretPos;
caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == '' ? text + '' : text;
}
else
textEl.value = text;
}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="aForm">
<TEXTAREA NAME="aTextArea" ROWS="5" COLS="80" WRAP="soft" ONSELECT="storeCaret(this);" ONCLICK="storeCaret(this);" ONKEYUP="storeCaret(this);">测试测试测试测试测试测试</TEXTAREA>
<BR>
<INPUT TYPE="text" NAME="aText" SIZE="80" VALUE="要插入的文字">
<BR>
<INPUT TYPE="button" VALUE="在光标处插入" ONCLICK="insertAtCaret(this.form.aTextArea,this.form.aText.value);">
</FORM>
</BODY>
</HTML>
往
光标
所在位置
插
入
值的
js
代码
在JavaScript
中
,向输
入
域(例如
文本框
或文本区域)的
光标
所在位置
插
入
字符串是一项常见的操作,这对于实现各种功能,如自动补全、格式化输
入
等非常有用。本篇文章将详细讲解如何利用JavaScript实现这一功能。 首先...
JavaScript 获取/设置
光标
位置,兼容Input&&TextArea
在进行Web开发时,经常需要在输
入
框(Input)或文本域(TextArea)
中
操作
光标
的位置,以实现高亮显示、
插
入
文本、获取用户输
入
的位置等效果。JavaScript为我们提供了操作这些元素的能力,但不同的浏览器之间存在一些差异...
2021-2022计算机二级等级考试试题及答案No.10294.docx
3.
文本框
滚动条显示:在编程
中
,若设置
文本框
的`ScrollBars`属性为`Both`,但没有显示滚动条,可能是因为
文本框
的`MultiLine`属性被设置为`False`,这意味着
文本框
无法显示
多行
文本,因此不需要滚动条。 4. 浏览器...
菜鸟学
JS
——
JS
在文本域
光标
位置
插
入
文本
很久没有写关于
JS
的博客了,说实话,对于
JS
小弟仅限于会简单使用的程度。...扯得稍微远了一些,回归正题,今天跟大家分享一个很实用的小实例——在
光标
处
插
入
文本。 function insertAtCursor(myField, myValue...
javascript实现textarea
中
光标
处
插
入
字符的实现[兼容ie和
firefox
]
因项目需要,需要在
多行
文本框
中
的
光标
位置
插
入
字符,利于
js
的 document.selection属性很快就实现,但发现在
firefox
中
无法兼容selection属性,网上找了很久也没有找到合适的方法,经过研究,改出了兼容ie和FF的完美...
JavaScript
87,997
社区成员
224,708
社区内容
发帖
与我相关
我的任务
JavaScript
Web 开发 JavaScript
复制链接
扫一扫
分享
社区描述
Web 开发 JavaScript
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章