首页 > 其他 > 详细

事件处理的实现【2012/07/29】

时间:2014-03-27 01:55:01      阅读:388      评论:0      收藏:0      [点我收藏+]

浏览器对实现对事件处理有几种方法:

1、<input type="button" onclick="javascript:handleEvent1(event);" value="单击1" />
//直接使用元素的事件属性
function handleEvent1(event){
  console.log("一些事件处理程序");
}

 

2、<input type="button" value="单击2" id="mybut" />

//直接给元素对象添加事件属性
function handleEvent2(event){
  console.log("事件处理程序");
}
var obut = document.getElementByIdx_x("mybut");
obut.onclick = handleEvent2;
 
3、<input type="button" value="单击3" id="mybut1" />
//使用script元素的for和event属性为脚本定义事件处理代码,仅IE支持该方法,不推荐使用
<script for="mybut1" event="onclick">
  console.log("事件处理");
</script>
 
4、 使用对象的fireEvent()方法,语法格式如下:
oFired = object.fireEvent(sEvent[,oEventObject])
参数sEvent用来指定事件字符串,oEventObject定义一个对象,用于获取event对象的属性,如果执行成功返回true,否则返回false。
 
5、使用attachEvent()和detachEvent()方法,用于事件绑定和解除,但这两个方法仅适用于IE,其他浏览器则使用addEventListener()和removeEventListener()来实现。
因此,为了使浏览器兼容,一般可以使用下面的代码:
<button id="mybutton">单击</button>
<script type="text/javascript">
//跨浏览器实现事件处理
var addEventListener = function(elementId,eventType,listener){
  try{
    var element = document.getElementByIdx_x(elementId);
      if(element.addEventListener){
        element.addEventListener(eventType,listener,false);
      }
      else if(element.attachEvent){
      element.attachEvent("on" + eventType,listener);
    }
  }catch(e){}
};
var removeEventListener = function(elementId,eventType,listener){
  try{
    var element = document.getElementByIdx_x(elementId);
    if(element.removeEventListener){
      element.removeEventListener(eventType,listener,false);
    }
    else if(element.detachEvent){
      element.detachEvent("on" + eventType,listener);
    }
  }catch(e){}
};
function handleEvent0(event){
  console.log("一些事件处理程序!");
  removeEventListener("mybutton","click",handleEvent0);
}
var oBut = document.getElementByIdx_x("mybutton");
addEventListener("mybutton","click",handleEvent0);
</script>

事件处理的实现【2012/07/29】,布布扣,bubuko.com

事件处理的实现【2012/07/29】

原文:http://www.cnblogs.com/zhengyingyan/p/3627211.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!