这个点击事件为什么我不可以这样写
html代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body onload="init()">
<div id="div1">
<div id="div2">
<input type="text" name="num" id="num">
</div>
<div id="div3">
<input type="button" name="" value="C">
<input type="button" name="" value="←">
<input type="button" name="" value="+/-">
<input type="button" name="" value="/">
<input type="button" name="" value="1" id="n1">
<input type="button" name="" value="2">
<input type="button" name="" value="3">
<input type="button" name="" value="*">
<input type="button" name="" value="4">
<input type="button" name="" value="5">
<input type="button" name="" value="6">
<input type="button" name="" value="-">
<input type="button" name="" value="7">
<input type="button" name="" value="8">
<input type="button" name="" value="9">
<input type="button" name="" value="+">
<input type="button" name="" value="0">
<input type="button" name="" value=".">
<input type="button" name="" value="=">
<input type="button" name="" value="m">
</div>
</div>
</body>
<script type="text/javascript" src="index.js"></script>
</html>
css代码:
*{
margin: 0px;
padding:0px;
}
#div1{
position: relative;
top: 50px;
left: 50px;
width: 180px;
}
input[type="text"]{
height: 30px;
outline: none;
line-height: 30px;
width: 175px;
text-align: right;
background-color: white;
}
input[type="button"]{
width: 35px;
height: 35px;
margin:3px 3px;
}
javascript代码:
function init(){
var text = document.getElementById("num");
text.value = 0;
text.disabled = "disabled";
var objButton = document.getElementsByTagName("input");
for ( var i = 0; i < objButton.length; i++ ){
var content = objButton[i].value;
objButton[i].onclick = function(){
alert(content);
}
}
}
function init(){
var text = document.getElementById("num");
text.value = 0;
text.disabled = "disabled";
var objButton = document.getElementsByTagName("input");
for ( var i = 0; i < objButton.length; i++ ){
var content = objButton[i].value;
objButton[i].onclick = function(){
alert(content);
}
}
}
为什么我这样写的话,无论按那个键都是弹出最后 "m"的value
正在回答
同学你好,因为i是objButton的索引,如果在循环外使用就获取不到了
在页面加载完成以后,for循环结束。i的值就是一个不再改变的值了。
比如在代码中增加如下语句:
页面加载完时已经输出了如下,相当于有了0~20个fuction,每个fuction对应的元素都是当时的i对应的oButton[i]:
所以当点击“1”按钮触发时,this对应的是触发的这个onclick事件的元素,也即是当初的oButton[i]。
如果我的回答解决了你的疑惑,请采纳!祝学习愉快!
- 参与学习 人
- 提交作业 9393 份
- 解答问题 16556 个
综合就业常年第一,编程排行常年霸榜,无需脱产即可学习,北上广深月薪过万 无论你是未就业的学生还是想转行的在职人员,不需要基础,只要你有梦想,想高薪
了解课程
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星