dom例子四（时钟倒数-加法-按钮触发）

最新推荐文章于 2021-11-09 11:07:26 发布

叶子的翅膀

最新推荐文章于 2021-11-09 11:07:26 发布

阅读量1.9k

点赞数

文章标签： button input function

本文链接：https://blog.csdn.net/xiaoxiqinqinbaobao/article/details/7650074

版权

技术归档专栏收录该内容

153 篇文章 0 订阅

订阅专栏

案例十：

几个按钮中，当点击一个按钮时，显示“我被抓到了” ，而其他按钮显示“没被抓到”

<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>

叶子的翅膀

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
dom例子四（时钟倒数-加法-按钮触发）

案例十：几个按钮中，当点击一个按钮时，显示“我被抓到了” ，而其他按钮显示“没被抓到” function initEvent(){ var inputs=document.getElementsByTagName("input"); for(var i=0;i<inputs.length;i++){ var input=inputs[i];
复制链接

扫一扫