js之前的点击事件的疑问
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);
}
}
}
这里的
for (var i=0; i <= objButton.length; i++ ){
var content = objButton[i].value; // 这里的值也都可以一次取出啊
objButton.onclick = function (){
alert(content);//这里依次获取上面的值不就可以吗？为什么这里一直获取的是最后一个值
}
}
正在回答
同学你好，在JS中，事件的监听的执行不是按照严格的执行先后顺序来的。在绑定的过程中click点击事件处理函数里的代码并没有运行。 只有在触发click事件的时候，才能知道要弹出的content值是什么，由于click方法中没有content变量，所以会去for循环中寻找，而在for循环中找到的content是for循环完的content，也就是m，所以点击所有按钮时，弹出的都是m。
祝学习愉快~
- 参与学习 人
- 提交作业 9393 份
- 解答问题 16556 个
综合就业常年第一，编程排行常年霸榜，无需脱产即可学习，北上广深月薪过万 无论你是未就业的学生还是想转行的在职人员，不需要基础，只要你有梦想，想高薪
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星