javascript调用onclick动作的几种方式。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
javascript调⽤onclick动作的⼏种⽅式。
var ebutt=document.getElementById("ebutt");
if(window.addEventListener){ // Mozilla, Netscape, Firefox
ebutt.addEventListener('click', ea('Hello,My function name is ea!'), true);
} else { // IE
ebutt.attachEvent('onclick', ea('Hello,My function name is ea!'));
}
和
function eb1(){
var ebutt=document.getElementById("ebutt");
ebutt.onclick=function(){
eb2()
};
}
以上都是直接执⾏了。
因为我要修改的是a标签的onclick事件的内容,所以⼜⽤了修改href的内容,来代替修改onclick.结果可以了,不过其它的没有href怎么为呢?
后来想想,觉得⾃⼰很傻,href是标签的⼀个属性,那onclick⼜何尝不是呢。
onclick既然是标签的⼀个属性,肯定有设置标签属性的⽅法,于是乎查看了⼀个html的⼿册,终于找到了setAttribute()⽅法。
(笔者曾经为这个事件纠结⼀阵⼦,没想到是如此的简单,看来还是对api不熟悉的缘故)
完整代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
input {width:300px;height:50px;line-height:50px;}
</style>
<script type="text/javascript">
function ea(str){
alert(str);
var ebutt=document.getElementById("ebutt");
ebutt.setAttribute("onclick","eb('Hello,My function name is ebbbbbbb!')");
}
function eb(str){
alert(str);
var ebutt=document.getElementById("ebutt");
ebutt.setAttribute("onclick","ea('Hello,My function name is eaaaaaaa!')");
}
</script>
</head>
<body>
<div>
<input id="ebutt" type="button" onclick="ea('Hello,My function name is eb!');" value="测试动态绑定onclik事件" />
</div>
</body>
</html>。