黑马程序员技术交流社区

标题: HTML中的应用问题 [打印本页]
作者: 自由の风    时间: 2013-10-25 12:02
标题: HTML中的应用问题
本帖最后由 自由の风 于 2013-10-27 16:35 编辑

在html页中做一个协议同意页面（就是某个网站注册前给用户看的那个协议条框），怎么能做到N秒后才能点击同意呢？就是同意上有个倒数计时(比如10秒)，10秒过后点击同意按钮才会生效
作者: 〆、单曲循环    时间: 2013-10-25 13:25
disabled="disabled" 将按钮设置为不可用状态  用setinterval 计时器计时  计时结束将disabled属性改为空
作者: 吴彤辉    时间: 2013-10-25 22:37
这是等待六秒后的
  1. <html>
  2. <head>
  3. <title></title>
  4. <meta http-equiv="content-type" content="text/html;charset=gb2312" />

  6. </head>
  7. <body>
  8. <form name="bbrules">
  9. <input type="submit" name="rulesubmit" style="height: 23px;" value="同 意" />
  10. </form>

  12. <script language="javascript">
  13. <!--
  14. //此段JS必须放在表单下面
  15. var secs = 2;
  16. var wait = secs * 1000;
  17. document.bbrules.rulesubmit.value = "同 意(" + secs + ")";
  18. document.bbrules.rulesubmit.disabled = true;
  19. for (i = 1; i <= secs; i++)
  20. {
  21. window.setTimeout("update(" + i + ")", i*1000);
  22. }
  23. window.setTimeout("timer()", wait);

  25. function update(num, value)
  26. {
  27. if (num == (wait/1000))
  28. {
  29.   document.bbrules.rulesubmit.value = "同 意";
  30. }
  31. else
  32. {
  33.   printnr = (wait/1000) - num;
  34.   document.bbrules.rulesubmit.value = "同 意(" + printnr + ")";
  35. }
  36. }
  37. function timer()
  38. {
  39. document.bbrules.rulesubmit.disabled = false;
  40. document.bbrules.rulesubmit.value = "同 意";
  41. }
  42. -->
  43. </script>

  45. </body>
  46. </html>
复制代码
作者: 夢醒了⊙﹏⊙b心    时间: 2013-10-26 18:00
不知道喽主要做成什么样子  假如要把效果做得好看些可以这个样子  
首先书写html标签button  然后再button中嵌套一个<input type="image"/>和一个span标签并设置好相应的css 在这里提醒楼主设置按钮disabled
书写js或者jquery控制按钮以及image和span 首先在页面开始的时候触发一个延迟改变背景的事件 将背景换成比较暗一点的颜色 然后将span数字改为10 并且这个数字呈递减状态 用在每隔一秒后用setinterval调用这个方法 再写一个判断方法  假如数字等于一以后首先将setintervalclose掉 然后将按钮改为可用状态  祝您成功
作者: 追溯客    时间: 2013-10-26 18:31
如问题得到解决,请及时修改为"以解决",黑马有你更精彩!



欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2