赞
踩
点击赋值按钮,为所有的文本框赋值;点击取值按钮,将所有的文本框的值打印在控制台上
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>循环赋值</title>
</head>
<body>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="1"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="2"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="3"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="1"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="5"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="5"/><br>
<label class="control-label col-md-2 col-sm-2 col-xs-12" name="prize_grade[]">一等奖</label><input type="text" name="prize_rank[]" value="6"/><br>
<button>赋值</button><br>
<button>取值</button>
<br><br><br>
<script>
var prize_grade = ['一','二','三', '四','五','六','七', '八','九', '十'];
var rankArr = document.getElementsByName("prize_rank[]");
var gradeArr = document.getElementsByName("prize_grade[]");
var inpArr = document.getElementsByTagName("input");
var buArr = document.getElementsByTagName("button");
//赋值
buArr[0].onclick = function(){
/* for (var i = 0; i < inpArr.length; i++) {
inpArr[i].value=i;
}*/
var num=1;
for (var j = 0; j < rankArr.length; j++) {
rankArr[j].value=num;
gradeArr[j].textContent=prize_grade[j]+"等奖";
num++;
}
}
//取值
buArr[1].onclick = function(){
var newArr=[];
for (var i = 0; i < inpArr.length; i++) {
newArr.push(inpArr[i].value);
}
console.log(newArr.join("-"));
}
</script>
</body>
</html>
点击赋值按钮前,效果如下:
点击赋值按钮后,效果如下:
点击取值后
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。