• js防止提交数据之后的按钮连击


    js防止提交数据之后的按钮连击

    一、实例描述

    当页面提交的数据特别多时,页面会反应比较迟钝,此时如果用户等不及而连续单击按钮,导致数据重复提交。本案例就是为了防止数据重复提交。

    二、截图

    三、代码

     1 <!DOCTYPE html>
     2 <html lang="zh-cn">
     3 <head>
     4     <meta charset="utf-8">
     5     <title>课堂演示</title>
     6     <style type="text/css">
     7      input{
     8       margin: 10px;
     9       width: 100px;
    10       height: 30px;
    11     }
    12     </style>    
    13 </head>
    14 <body>
    15 
    16 <input type=button value="提交" onClick="check()">
    17 
    18 <script type="text/javascript">
    19     function check(){
    20         if (window.document.readyState == 'complete'){
    21 
    22             alert("加载完毕,可以继续"); 
    23 
    24             return true;
    25 
    26         }else{
    27 
    28             alert("正在处理,请等待!");
    29 
    30             return false; 
    31 
    32         }
    33     }
    34 </script>
    35 
    36 </body>
    37 </html>

    1、判断document的状态

    2、window对象和document对象的层级关系

    3、document的readyState属性

    4、防止连击的方法:添加点击事件,提示用户处理进程

    5、js中等于号写法,和php,java,c++都一样

    6、这里字符串用的单引号

    四、总结

    案例要点:

    本例的重点是如何判断页面的状态。

    readyState 属性返回当前文档的状态,该属性返回以下值:

    • uninitialized - 还未开始载入
    • loading - 载入中
    • interactive - 已加载,文档与用户可以开始交互
    • complete - 载入完成
  • 相关阅读:
    Super Jumping! Jumping! Jumping!
    glsl学习之cube
    取得某个进程CPU的占用率
    在游戏中使用“CEGUI”
    vbo 简单演示
    平行光镜面反射模型
    使用fbo来实现render to texture演示
    平行光漫反射模型
    glsl teapot 简单演示
    点光源模型
  • 原文地址:https://www.cnblogs.com/Renyi-Fan/p/8970552.html
Copyright © 2020-2023  润新知