摘自网络
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>在textarea光标处插入文字</title>
<script type="text/javascript">
//在光标位置插入文字
function insertText(obj, str) {
obj.focus();
if (document.selection) {
var sel = document.selection.createRange();
sel.text = str;
} else if (typeof obj.selectionStart == 'number'
&& typeof obj.selectionEnd == 'number') {
var startPos = obj.selectionStart, endPos = obj.selectionEnd, cursorPos = startPos, tmpStr = obj.value;
obj.value = tmpStr.substring(0, startPos) + str
+ tmpStr.substring(endPos, tmpStr.length);
cursorPos += str.length;
obj.selectionStart = obj.selectionEnd = cursorPos;
} else {
obj.value += str;
}
}
function moveEnd(obj) {
obj.focus();
var len = obj.value.length;
if (document.selection) {
var sel = obj.createTextRange();
sel.moveStart('character', len);
sel.collapse();
sel.select();
} else if (typeof obj.selectionStart == 'number'
&& typeof obj.selectionEnd == 'number') {
obj.selectionStart = obj.selectionEnd = len;
}
}
</script>
</head>
<body>
<p>
<textarea id="text" style="width: 500px; height: 80px;">欢迎访问xdwangiflytek.iteye.com</textarea>
</p>
<p>
<input type="button" value="插入文字"
onclick="insertText(document.getElementById('text'),' NewWord ')">
</p>
<p>
<input type="button" value="移到末尾"
onclick="moveEnd(document.getElementById('text'))">
</p>
</body>
</html>
分享到:
相关推荐
JS在TextArea光标位置插入文字+移动光标到文字末尾,Firefox,Chrome,Safari以及Opera都有selectionStart和selectionEnd属性,具体实现如下,感兴趣的朋友可以参考下哈
在textarea光标处插入文本
使用javascript控制在光标位置插入文字,在实现表情的插入时会用到的,需要的朋友可以参考下
主要介绍了jquery实现在光标位置插入内容的方法,涉及jQuery功能的扩展技巧,具有一定参考借鉴价值,需要的朋友可以参考下
JS获取文本框焦点光标位置、选中起始位置、终止位置、选择内容、兼容IE8,很好的例子!
往输入域中插入字符串(光标所在位置),在本文将为大家介绍下使用js是如何实现的,感兴趣的朋友可以参考下
比如要在输入的文档中插入一些表情符号,图片之类的,这个时候在插入文字之前, 就需要先判断光标的位置了。今天就特意给大家推荐这样一个小方法,已经集成为插件的形式 就不会有冲突的情况发生了 使用方法:...
jQuery textArea文本光标全功能插件,可以获取光标位置,向光标文字插入文本,高亮显示指定的文本块
以上场景都需要JS实现将光标定位于输入框最右侧,却不是通过鼠标点入输入框内。 我们知道实现最基本的方法是HTMLElement的focus方法。如下 代码如下: <p> <input type=”text” value=”hello”/> </p> ...
那就是obj.focus()将焦点移动到输入框后,会将文字光标(就是一闪一闪的竖线)移动到这个输入框的第一个字符的位置…就上面的判断而言..如果文本框中没有内容..obj.focus正好可以满足我们直接在文本框中输入内容而不用...
实现文本框插入表情 表情解析 表情分页 模仿微信留言页面 在光标位置插入删除文字 微信全套默认表情包 HTML5 javascript jquery
模仿百度首页,模糊搜索,搜索第一个字之后出现带有这个文字或词语的搜索内容,按enter键进入下个页面后,出现打字机效果,文字一个一个蹦出来.代码不多,js不到20行,简单易懂,一看就会
在光标位置插入文本 用文字替换所选范围 处理浏览器之间的行尾差异 选择/取消选择任何元素中的所有文本 原料药 脱字号 $.fn.caret() 在单个点上询问并操纵输入字段的光标位置,而无需选择任何文本。 .caret()返回...
23、原生JavaScript光标停在文字的后面,文本框获得焦点时调用 24、原生JavaScript检验URL链接是否有效 25、原生JavaScript格式化CSS样式代码 26、原生JavaScript压缩CSS样式代码 27、原生JavaScript获取当前路径 28...
3.29 光标停在文字最后 3.30 分行取textarea中的值 3.31 自动插入文本 3.32 选取textarea的指定行 3.33 文本放大镜 3.34 文本框的默认输入法 3.35 文本框显示网页中选中的内容 3.36 文字的垂直滚动 3.37 文字幻灯片 ...
3.29 光标停在文字最后 3.30 分行取textarea中的值 3.31 自动插入文本 3.32 选取textarea的指定行 3.33 文本放大镜 3.34 文本框的默认输入法 3.35 文本框显示网页中选中的内容 3.36 文字的垂直滚动 3.37 文字幻灯片 ...
实例067 可以输入文字的下拉菜单 111 实例068 根据下拉菜单的值显示不同控件 112 实例069 分级下拉列表 113 2.3 单选按钮组 114 实例070 不提交表单获取单选按钮的值 114 实例071 选中单选按钮后显示其他表单元素 ...
9.26 双重输入文字... 272 9.27 以图片显示输入的数字... 273 9.28 制作Google搜索表单... 275 9.29 一个简单的计算器... 276 9.30 取得文字区域中文字的行数... 277 9.31 在文字区域中移动光标的位置... 278 ...