案例十 :
几个按钮中,当点击一个按钮时,显示“我被抓到了” ,而其他按钮显示“没被抓到”
<html>
<head>
<title></title>
<script type="text/javascript">
function initEvent(){
var inputs=document.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++){
var input=inputs[i];
input.οnclick=btnClick;
}
}
function btnClick(){
var inputs=document.getElementsByTagName("input");
for(var i=0;i<inputs.length;i++){
var input=inputs[i];
//取得引发事件的控件
if(input==window.event.srcElement){
input.value="我被抓到了";
}else{
input.value="我没被抓到";
}
}
}
</script>
</head>
<body οnlοad="initEvent()">
<input type="button" value="不要抓我"/>
<input type="button" value="不要抓我"/>
<input type="button" value="不要抓我"/>
<input type="button" value="不要抓我"/>
<input type="button" value="不要抓我"/>
</body>
</html>
案例十一 :
简易加法计算器
<html>
<head>
<title></title>
<script type="text/javascript">
function calculate(){
var val1=document.getElementById("txt1").value;
var val2=document.getElementById("txt2").value;
document.getElementById("txt3").value=parseFloat(val1)+parseFloat(val2);
}
</script>
</head>
<body >
<input id="txt1" type="text" />+<input id="txt2" type="text" />
<input type="button" οnclick="calculate()" value="="/><input id="txt3" type="text" readonly="readonly"/>
</body>
</html>
案例十二 十秒钟后协议文本框下的注册按钮才能被点击,时钟倒数
btn.disabled=true;
注册按钮初始状态为不可用disabled
启动定时器,setInterval,1秒运行一次CountDown方法。设定一个初始值为10的全局变量
在CountDown方法中对全局变量进行倒数,然后将倒数的值定局到注册按钮上 如:请仔细阅读协议(还剩8秒)
直到全局变量为小于等于0,就让注册按钮可用,将按钮的文本设置为同意
<html>
<head>
<title></title>
<script type="text/javascript">
var leftSeconds=10;
function CountDown(){
var time1;
var btnReg=document.getElementById("btnReg");
if(btnReg)//如果网页速度慢,可能定时器运行的时候控件还没有加载
{
if(leftSeconds<=0){
btnReg.value="agree";
btnReg.disabled="";//btnReg.disabled=false;
clearInterval(time1);
}else{
btnReg.value="请仔细阅读协议(还剩"+leftSeconds+"秒)";
leftSeconds--;
}
}
}
time1=setInterval("CountDown()",1000);
</script>
</head>
<body οnlοad="initEvent()">
<textarea></textarea>
<input name="btnReg" type="button" value="agree" disabled="disabled"/>
</body>
</html>