jQuery练习
案例演示:自动打分
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>自动打分</title>
<script type="text/javascript" src="../js/jquery-1.11.1.js"></script>
<script type="text/javascript">
function score(){
//获取所有文本框
var $texts = $(":text");
//启动定时器
var index = 0;
var id = setInterval(function(){
//模拟光标切入
$texts.eq(index).trigger("focus");//jQuery的trigger函数
//生成随机数
var n = parseInt(Math.random()*100);
//获取并写入此框
$texts.eq(index).val(n);
index++;
if(index > $texts.length){
clearInterval(id);
}
},2000);
}
</script>
</head>
<body>
<input type="button" value="打分"
onclick="score();">
<p>
苍老师:<input type="text">
</p>
<p>
王老师:<input type="text">
</p>
<p>
范老师:<input type="text">
</p>
<p>
李老师:<input type="text">
</p>
<p>
程老师:<input type="text">
</p>
<p>
梁老师:<input type="text">
</p>
</body>
</html>
最终页面显示效果:点击"打分"按钮 便会自动逐个打分