事件
事件的三要素:
1.事件源 2.事件类型 3.事件处理程序
事件的使用
1.在标签内通过属性使用事件
<input type="text" onclick="script:alert('行内代码')">
2.通过js注册事件
事件源.时间类型=function(){}
<body>
<input type="text" value="默认内容">
<script>
var ip = document.getElementsByTagName("input");
ip.onclick=function(){
document.write("默认内容");
}
</script>
</body>
事件源.addEventListener("事件类型",处理程序,布尔值);
事件类型:字符串,不加on
处理程序: 匿名函数或调用函数
布尔值:
<body>
<input type="text" value="默认内容">
<script>
var ip = document.getElementsByTagName("input");
ip.addEventListener("mouseover",ipOnmouse,false);
function ipOnmouse(){
document.write("匿名函数");
}
</script>
</body>
有兼容性的注册事件函数
function addEvent(element,eventType,funName,broad){
if(element.addEventListener){
element.addEventListener(eventType,funName,broad);
}else if(element.attachEvent){
element.attachEvent("on"+eventType,funName);
}else{
element["on"+eventType] = funName;
}
}
移除事件
事件源.时间类型=“null”;
<body>
<input type="text" value="默认内容">
<script>
var ip = document.getElementsByTagName("input");
ip.addEventListener("mouseover",ipOnmouse,false);
function ipOnmouse(){
document.write("匿名函数");
}
ip.mouseover=“null”;
</script>
</body>
事件源.removeEventListener(“事件类型”);
<body>
<input type="text" value="默认内容">
<script>
var ip = document.getElementsByTagName("input");
ip.addEventListener("mouseover",ipOnmouse,false);
function ipOnmouse(){
document.write("匿名函数");
}
ip.removeEventListener("mouseover",ipOnmouse,false);
</script>
</body>
事件源.detachEvent(“事件类型”); 只能使用IE浏览器
有兼容性的移除事件函数
function removeEvent(element,eventType,funName,broad){
if(element.removeEventListener){
element.removeEventListener(eventType,funName,broad);
}else if(element.detachEvent){
element.detachEvent("on"+eventType,funName);
}else{
element["on"+eventType] = null;
}
}