作家
登录

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

作者: 来源:www.28hudong.com 2013-03-30 00:59:34 阅读 我要评论

注意:在firefox下 添加字符串的时候有个bug 就是scrollTop 会等于0,当然解决了,但是不够完美。如果有高手也研究过,麻烦指点下。 完整测试代码:复制代码 代码如下:<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>

  推荐阅读

  js对象的比较

复制代码 代码如下: Object.prototype.equals = function(obj){ if(this == obj) return true; if(typeof(obj)=="undefined"||obj==null||typeof(obj)!="object") return false; var length = 0; var length1=0; f>>>详细阅读


本文标题:js操作textarea方法集合封装(兼容IE,firefox)

地址:http://www.17bianji.com/kaifa2/JS/24896.html

关键词: 探索发现

乐购科技部分新闻及文章转载自互联网,供读者交流和学习,若有涉及作者版权等问题请及时与我们联系,以便更正、删除或按规定办理。感谢所有提供资讯的网站,欢迎各类媒体与乐购科技进行文章共享合作。

网友点评
自媒体专栏

评论

热度

精彩导读
栏目ID=71的表不存在(操作类型=0)