對(duì)Class的處理
//增加類名
addClass : function(obj,classname){
if(obj.className == ''){
obj.className = classname;
}else{
var arrClassName = obj.classname.split(' ');
if(arrIndexOf(arrClassName , classname) == -1){
obj.className += ' ' +classname;
}
}
}
//移除類
removeClass: function(obj, classname){
if(obj.classname !== ''){
var arrClassName = obj.className.split(' ');
if(arrIndexOf(arrClassName , classname) != -1){
arrClassName.splice(arrIndexOf(arrClassName, classname) , 1);
obj.className = arrClassName.join(' ');
}
}
}
//判斷要添加的類名是否已經(jīng)存在
arrIndexOf: function(arr,v){
for(var i = 0; i<arr.length;i++){
if(arr[i] == v){ return i;}
}
return -1;
}
placeholder兼容函數(shù)
var obj = document.getElementById('input');
obj.onfocus = function(){
if(this.value == '請(qǐng)輸入內(nèi)容'){
this.value ='';
}
}
obj.onblur = function(){
if(this.value == ''){
this.value = '請(qǐng)輸入內(nèi)容' ;
}
}
對(duì)事件的處理
var evet_fn = {
//事件綁定
bind:function(obj,evname,fn){
if(obj.addEventListener){
obj.addEventListener(evname,fn,false);
}else{
obj.attachEvent('on'+evname,function(){
fn.call(obj);
//調(diào)用call方法,在IE下將this從指向window改為指向當(dāng)前對(duì)象
}
)}
}
//事件解綁
removeBind : function(obj,evname,fn,b1){
if(obj.removeEventListener){
obj.removeEventListener(evname,fn,b1);
}else{ obj.detachEvent('on'+evname,fn,function(){ fn.call(obj); })
}
}
//頁(yè)面加載完成
readyEvent:function(fn){
if(fn == null){ fn = document; }
var oldOnload = window.onload;
if(typeof window.onload !== ‘function’){
window.onload = fn;
}else{
windwo.onload = function(){
oldOnload();
fn();
}
}
}
//添加事件
addHandler : function(element, type, handler){
if(element.addEventListener){ //DOM2級(jí)
//事件類型,需要執(zhí)行額函數(shù) 是否捕捉 element.addEventListerner(type,handler,false);
}else if(element.attachEvent){ //是否為IE級(jí)
element.attachEvent('on' + type, handler);
}else{ //檢查是否為DOM0級(jí)的方法
element['on' + type] = handler;
}
}
//移除事件
removeHandler: function(element,type,handler){
if(element.removeEventListener){
element.removeEventListener(type,handler,false);
}else if( element.detachEvent){
element.detachEvent('on' + type, handler);
}else{
element["on" + type] =null;
}
}
// 獲取事件及事件對(duì)象
getEvent : function(event){
return event ? event : window.event;
}
//獲取事件對(duì)象目標(biāo)的寫(xiě)法
getTarget :function(event){
return event.target || event.srcElement;
}
//阻止瀏覽器默認(rèn)事件
preventDefault: function(event){
if(event.preventDefault){
event.preventDefault(); //W3C標(biāo)準(zhǔn)
}else{
event.returnValue = false; //IE
}
}
//組織事件冒泡的兼容寫(xiě)法
stopPropagation: function(event){
if(event.stopPropagation){
event.stopProgation();
}else{
event.cancelBubble = true;
}
}
//獲取事件(在mouseover和mouseout事件監(jiān)測(cè)中)
getRelatedTarget: function(event){
if(event.relatedTarget){
return event.relatedTarget;
}else if(event.toElement){
return event.toElement;
}else if(event.fromElement){
return event.fromElement;
}else{
return null;
}
}
//獲取event對(duì)象的引用,取到事件的所有信息,確保隨時(shí)能使用event;
getEvent:function (event) {
var event = event || window.event;
if (!event) {
var c = this.getEvent.caller;
while(!c){
event = c.arguments[0];
if (event && Event == ev.constructor) {
break;
};
c = c.caller;
}
};
return event;
}
}
鼠標(biāo)滾輪判斷
類似于
mousedown和mouseup事件,event對(duì)象存在一個(gè)button屬性
DOM的button屬性:
- 0 表示主鼠標(biāo)按鈕 即左鍵
- 1 表示中間鼠標(biāo); 即中間滾輪
- 2 表示次鼠標(biāo)按鈕 即右鍵
IE8及之前版本button屬性
- 0 沒(méi)有按下按鈕
- 1 按下了主鼠標(biāo)按鈕
- 2 按下了次鼠標(biāo)按鈕
- 3 同時(shí)按下了主、次鼠標(biāo)按鈕
- 4 按下了中間的鼠標(biāo)按鈕
- 5 同時(shí)按下了主鼠標(biāo)和中間的鼠標(biāo)按鈕
- 6 同時(shí)按下了次鼠標(biāo)和中間的鼠標(biāo)按鈕
- 7 同時(shí)按下了三個(gè)鼠標(biāo)按鈕
getButton : function(event){
if(document.implementation.hasFeature("MouseEvents" , "2.0")){
return event.button;
}else{
switch(event.button){
case 0: return -1; //指沒(méi)有按下任何按鈕
case 1:
case 3:
case 5:
case 7: return 0;
case 2:
case 6: return 2;
case 4: return 1;
}
}
}
鼠標(biāo)滾輪增量值 delta
getWheelDelta: function(){
if(event.wheelDelta){
return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta) ;
}else{
return -event.detail * 40; //firefox中的值為+3表示向上滾,-3表示向下滾
}
}
跨瀏覽器的方式取得字符編碼
getCharCode:function(event){
if(typeof event.chartCode == "number"){
return event.chartCode;
}else{
return event.keyCode;
}
}
訪問(wèn)剪貼板的數(shù)據(jù)
getClipboardText :function(event){
var clipboardData = (event.clipboardData || window.clipboardData);
return clipboardData.getData('text');
}
設(shè)置剪貼板中的數(shù)據(jù)
setClipboardText :function(event,value){
if(event.clipboardData){
retrun event.clipboardData.setData('text/plain',value);
}else if(window.clipboardData){
return window.clipboardData.setData('text',value);
}
}