var textareaJS = {
// Event binding
addEvent:function (el, type, callback) {
if(el.addEventListener){
el.addEventListener(type, callback, false)
}else{
el.attachEvent('on' + type, callback);
}
},
//Get pixel values, only px and rem units are supported
getPxValue:function(str){
var n = 0;
if(!str) return 0;
if(typeof str == 'number') return str;
if(str.search('px') != -1) n = parseFloat(str);
//When the value is '6rem'
if(str.search('rem') != -1) {
var m = parseFloat(S.getStyle(document.documentElement,"font-size"));
n = m * parseFloat(str);
};
return n;
},
/* Get the cursor position
* el input box element
* isFocus Whether to get the element focused when obtaining the cursor position
*/
getPosition:function(el,isFocus) {
isFocus && el.focus ();
if (document.selection) { //Low version IE
var range = document.selection.createRange();
range .moveStart ('character', -el.value.length);
return range.text.length;
}else if (el.selectionStart != null ){ //Some input types do not support filtering
return el.selectionStart;
}
},
/* Set cursor position
* el input box element
* pos position subscript, if 'last', move to the end
*/
setPosition:function(el, pos) {
el.focus();
if(pos == 'last'){
pos = el.value.length
}
if(el.setSelectionRange) {
el.selectionStart = el.selectionEnd = pos;
}else if (el.createTextRange) { //IE lower version browser
var range = el.createTextRange();
range.collapse(true);
range.moveEnd('character', pos);
range.moveStart('character', pos);
range.select();
}
},
//Get selected text
getSelectText:function() {
if (document.selection) { //Low version IE
return document.selection.createRange().text;
}else{
return window.getSelection().toString();
}
},
/*Settings are selected
* el input box element
* start
* end end subscript
*/
setSelectText:function(el, start, end) {
var a = parseInt(start);
var b = parseInt(end);
if(start>end){
start = b;
end = a;
}else{
start = a;
end = b;
}
if(el.createTextRange){ //Low version IE
var range = el.createTextRange();
range.collapse(true);
range.moveStart("character", start);
range.moveEnd("character",end-start);
range.select();
}else{
el.setSelectionRange(start, end);
}
el.focus();
},
/*Insert text at the cursor
* el input box element
* value Inserted text
*/
insertText:function(el, value) {
var len = (''+value).length;
el.focus();
if (document.selection) { //IE lower version
var range = document.selection.createRange();
range.text = value;
}else if (el.selectionStart != null ) {
var start = el.selectionStart;
var end = el.selectionEnd;
var scrollTop = el.scrollTop;
el.value = el.value.substring(0, start)
+ value +
el.value.substring(end, el.value.length);
el.selectionStart = el.selectionEnd = start + len;
el.scrollTop = scrollTop;
}else {
el.value += value;
}
},
//High adaptive
auto:function(o){
var el = o.el; //Input box element
var height = this.getPxValue(o.height) || 100; //Height, default 100px
var width = this.getPxValue(o.width) || 200; //Width, default 200px
var auto = o.auto || false; //Whether to enable high adaptation
var max = this.getPxValue(o.max); //Maximum height, support rem units
var callback = o.callback || false; //Input box input event
//No pulling
el.style.resize = 'none';
el.style.height = height + 'px';
el.style.width = width + 'px';
//Add a listening event
this.addEvent(el, 'input', change);
this.addEvent(el, 'keyup', change);
this.addEvent(el, 'focus', resize);
// When performing asynchronous processing of inserting text, insert the text first and perform height judgment
function resize(){
setTimeout(function(){ change() },0)
}
function change(){
//High adaptive
if(auto){
el.style.overflowY = 'hidden'
//The page is scrolling up and down
var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
var boxH = el.offsetHeight;
el.style.height = height + 'px'; //Initialize the height first each time
if(el.scrollHeight > el.clientHeight ){ //Judge the scroll height
var add = el.scrollHeight - el.clientHeight //Increment
if( max && height + add > max ){ //Is the maximum value exceeded
el.style.height = max + 'px';
el.style.overflowY = 'auto';
}else{
el.style.height = height + add + 'px'
}
};
document.body.scrollTop = el.offsetHeight - boxH + scrollTop;
document.documentElement.scrollTop = el.offsetHeight - boxH + scrollTop;
}
if(callback) callback(el.value,el)
};
return el;
}
}