当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Javascript事件处理代码的三种写法

Javascript
用户注册常用javascript代码
JavaScript 事件监听实例代码[兼容IE,firefox] 含注释
javascript appendChild,innerHTML,join性能比较代码
JavaScript 继承详解 第一篇
javascript 控制 html元素 显示/隐藏实现代码
Javascript 判断函数类型完美解决方案
获取URL地址中的文件名和参数的javascript代码
js 获取浏览器高度和宽度值(多浏览器)
FF IE兼容性的修改小结
JS URL传中文参数引发的乱码问题
javascript 24小时弹出一次的代码(利用cookies)
ie focus bug 解决方法
javascript concat数组累加 示例
javascript 触发事件列表 比较不错
当文本框的值发生改变时,触发事件,在IE中有效
javascript 操作table的特性
jquery判断单个复选框是否被选中的代码
关于javascript中的parseInt使用技巧
JavaScript 密码强度判断代码
js跨域和ajax 跨域问题的实现思路

Javascript事件处理代码的三种写法


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-28   浏览: 179 ::
收藏到网摘: n/a

1.作为HTML属性值的事件处理程序


 HTML代码
<input name="btn" type="button" id="btn" value="按钮" onclick="alert('mzwu.com');" />
 


2.作为JavaScript属性的事件处理程序


 HTML代码
<input name="btn" type="button" id="btn" value="按钮"  />
<script language="javascript">
document.getElementById("btn").onclick = function(){alert("mzwu.com");}
</script>
 


说明:可能受第一种方法的误导,你会觉得应该写成:document.getElementById("btn").onclick() = "alert('mzwu.com');",这样写是错误的!其实第一种方法隐式的创建了一个函数,使用下边代码可以说明这一点,因为它检测出HTML属性值其实是一个函数:


 HTML代码
<input name="btn" type="button" id="btn" value="按钮" onclick="alert(typeof(this.onclick));" />
 


上边是用直接量来创建函数,改成用function()语句的写法:


 HTML代码
<input name="btn" type="button" id="btn" value="按钮"  />
<script language="javascript">
function e()
{
 alert("mzwu.com");
}
document.getElementById("btn").onclick = e;
</script>
 


由此我们可引申出第三种方法。

3.第三种方法


 HTML代码
<input name="btn" type="button" id="btn" value="按钮"  />
<script language="javascript">
function document.all.btn.onclick()
{
 alert("mzwu.com");
}
</script>
 


说明:诸如此类的方法还有function document.onclick(){},但这种方法在IE、FF中测试只有IE下可行,再改成function document.getElementById("btn").onclick(){}在IE、FF下都不行了,提示缺少标识符,其实这也不难解释,因为JavaScript标识符中本来就不允许出现点号,用document.getElementById("btn").onclick做标识符显然是错误的,但document.all.btn.onclick却又可以实在有点让人费解。