源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

js操作textarea方法集合封装(兼容IE,firefox)

  • 时间:2020-12-02 03:29 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:js操作textarea方法集合封装(兼容IE,firefox)
注意:在firefox下 添加字符串的时候有个bug 就是scrollTop 会等于0,当然解决了,但是不够完美。如果有高手也研究过,麻烦指点下。 完整测试代码:
[u]复制代码[/u] 代码如下:
<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>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部