- <textarea id="testlujun" style="width: 300px; height: 50px;">abcdefghijklmnopqrstuvwxyz</textarea>
- <br />
- <input onclick="alert(TT.getCursorPosition(test))" type="button" value="光标位置" />
- <input onclick="TT.setCursorPosition(test,3)" type="button" value="设置光标到3第位置" />
- <input onclick="TT.add(test,'你好')" type="button" value="添加'你好'到光标后面" />
- <input onclick="TT.del(test,2)" type="button" value="删除光标前2个字符" />
- <input onclick="TT.del(test,-2)" type="button" value="删除光标后2个字符" />
- <input onclick="TT.sel(test,0,2)" type="button" value="选中字符0-2的位置" />
- <input onclick="TT.selString(test,'mno')" type="button" value="选中字符'mno'的位置" />
- <script type="text/javascript">// <![CDATA[
- var test = document.getElementById('testlujun');
- var TT = {
- /*
- * 获取光标位置
- * @Method getCursorPosition
- * @param t element
- * @return number
- */
- getCursorPosition: function(t){
- if (document.selection) {
- t.focus();
- var ds = document.selection;
- var range = ds.createRange();
- var stored_range = range.duplicate();
- stored_range.moveToElementText(t);
- stored_range.setEndPoint("EndToEnd", range);
- t.selectionStart = stored_range.text.length - range.text.length;
- t.selectionEnd = t.selectionStart + range.text.length;
- return t.selectionStart;
- } else return t.selectionStart
- },
- /*
- * 设置光标位置
- * @Method setCursorPosition
- * @param t element
- * @param p number
- * @return
- */
- setCursorPosition:function(t, p){
- this.sel(t,p,p);
- },
- /*
- * 插入到光标后面
- * @Method add
- * @param t element
- * @param txt String
- * @return
- */
- add:function (t, txt){
- var val = t.value;
- if(document.selection){
- t.focus()
- document.selection.createRange().text = txt;
- } else {
- var cp = t.selectionStart;
- var ubbLength = t.value.length;
- var s = t.scrollTop;
- // document.getElementById('aaa').innerhtml += s + '<br />';
- t.value = t.value.slice(0,t.selectionStart) + txt + t.value.slice(t.selectionStart, ubbLength);
- this.setCursorPosition(t, cp + txt.length);
- // document.getElementById('aaa').innerHTML += t.scrollTop + '<br />';
- firefox=navigator.userAgent.toLowerCase().match(/firefox\\/([\\d\\.]+)/) && setTimeout(function(){
- if(t.scrollTop != s) t.scrollTop=s;
- },0)
- };
- },
- /*
- * 删除光标 前面或者后面的 n 个字符
- * @Method del
- * @param t element
- * @param n number n>0 后面 n<0 前面
- * @return
- * 重新设置 value 的时候 scrollTop 的值会被清0
- */
- del:function(t, n){
- var p = this.getCursorPosition(t);
- var s = t.scrollTop;
- var val = t.value;
- t.value = n > 0 ? val.slice(0, p - n) + val.slice(p):
- val.slice(0, p) + val.slice(p - n);
- this.setCursorPosition(t ,p - (n < 0 ? 0 : n));
- firefox=navigator.userAgent.toLowerCase().match(/firefox\\/([\\d\\.]+)/) && setTimeout(function(){
- if(t.scrollTop != s) t.scrollTop=s;
- },10)
- },
- /*
- * 选中 s 到 z 位置的文字
- * @Method sel
- * @param t element
- * @param s number
- * @param z number
- * @return
- */
- sel:function(t, s, z){
- if(document.selection){
- var range = t.createTextRange();
- range.moveEnd('character', -t.value.length);
- range.moveEnd('character', z);
- range.moveStart('character', s);
- range.select();
- }else{
- t.setSelectionRange(s,z);
- t.focus();
- }
- },
- /*
- * 选中一个字符串
- * @Method sel
- * @param t element
- * @param s String
- * @return
- */
- selString:function(t, s){
- var index = t.value.indexOf(s);
- index != -1 ? this.sel(t, index, index + s.length) : false;
- }
- }
- // ]]></script>
- //该片段来自于http://www.codesnippet.cn/detail/170720134634.html
来源: http://www.codesnippet.cn/detail/170720134634.html