首頁 > web前端 > js教程 > 主體

js操作textarea 常用方法總結_javascript技巧

WBOY
發布: 2016-05-16 17:47:30
原創
965 人瀏覽過

在DOM裡面操作textarea裡面的字符,是比較麻煩的。
於是我有這個封裝分享給大家,測試過IE6,8, firefox ,chrome, opera , safari。相容沒問題。
注意:在firefox下 加入字串的時候有個bug 就是scrollTop 會等於0,當然解決了,但不夠完美。如果有高手也研究過,麻煩指點下。

複製程式碼 程式碼如下:

var TT = {
/* * 取得遊標位置
* @Method getCursorPosition
* @param t element
* @return number
*/
getCursorPosition: function(t){
if (document.) {
t.focus();
var ds = document.selection;
var range = ds.createRange();
var stored_range = range.duplicate();
stored_range.moveElement (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
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。 ('aaa').innerHTML = s '
';
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 '
';
firefox=navigator.userAgenttoLowerigatorC. ().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* @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 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;
}
}
相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板