• 修改后的prototype.js,增加进度条和验证输入框


    使用示例
    <script type="text/javascript" src="../scripts/prototype.js"></script>
    <script type="text/javascript">
    var progressBar;
    /*
    * 功能:admin登录
    */

    function UserLogin()
    {
        
        
    //验证页面控件
        var checkform = new CheckForm();
        
    if(!checkform.checkForm(document.getElementById('formLogin'))) return false;    
            
        
    //开始提交数据
        progressBar = new ProgressBar();
        progressBar.SetStatus(
    "正在发送数据到服务器.");
        
        var url 
    = "../admin.do";
        var pars 
    = "action=Login&username=" + $F('username'+ "&password=" + $F('password'+ "&rnd=" +$F('rnd');
        var myAjax 
    = new Ajax.Request(
        url,
        
    {method: 'post', parameters: pars, onComplete: UserLogin_CallBack}
        );
    }

    /*
    * 功能:admin登录 - CallBack
    */

    function UserLogin_CallBack(originalRequest)
    {
      var objXml 
    = originalRequest.responseXML;
      
    //alert(originalRequest.responseTEXT);
      try
      
    {
        
    if(objXml.getElementsByTagName("return")[0].firstChild.nodeValue == "true")
        
    {
          progressBar.isNeedConfirmButton 
    = false;
          progressBar.isNeedProgressBar 
    = true;
          progressBar.SetStatus(
    "<img src='../images/error.gif' align='absmiddle'> 登录成功,正在载入,请稍候..");

          
    //login success
          location.href='admin_index.htm';
        }

        
    else
        
    {
          progressBar.isNeedConfirmButton 
    = true;
          progressBar.isNeedProgressBar 
    = false;
          progressBar.focusItem 
    = "username";
          progressBar.SetStatus(
    "<img src='../images/error.gif' align='absmiddle'> 对不起,登录失败!" + objXml.getElementsByTagName("msg")[0].firstChild.nodeValue);

          $(
    'btnOK').disabled = false;
        }

      }

        
    catch(err)
        
    {
          progressBar.isNeedConfirmButton 
    = true;
          progressBar.isNeedProgressBar 
    = false;
          progressBar.focusItem 
    = "username";
          progressBar.SetStatus(
    "<img src='../images/error.gif' align='absmiddle'> 对不起,登录失败!" + err.message);

          $(
    'btnOK').disabled = false;
        }

      }

    </script>



    <table width="100%" border="0" cellpadding="3" cellspacing="0">
                  
    <tr>
                    
    <td colspan="3" height="30"></td>
                  
    </tr>
                  
    <tr>
                    
    <td width="21%">用户名:</td>
                    
    <td colspan="2">
                      
    <input type="text" tabindex="1" id="username" name="username" chname="用户名" notempty="true" size="20" style="180px;" /></td>
                  
    </tr>
                  
    <tr>
                    
    <td>密 码:</td>
                    
    <td colspan="2"><input type="password" tabindex="2" id="password" name="password" chname="密码" notempty="true" size="20" style="180px;" /></td>
                  
    </tr>
                  
    <tr>
                    
    <td>验证码:</td>
                    
    <td colspan="2">
                      
    <input type="text" style="120px;" id="rnd" tabindex="3" chname="验证码" class="input_1" notempty="true" onKeyUp="value=value.replace(/[^\d]/g,'')"/>
                      
    <img alt="验证码" src="../rnd.do?type=admin_rnd" border="0" usemap="absmiddle"/></td>
                  
    </tr>              
                    
    <tr>
                      
    <td class="white">&nbsp;</td>
                      
    <td width="22%"><input type="submit" Class="input_1" id="btnOK" value="登 录" tabindex="4"></td>
                        
    <td width="57%"><input type="reset" Class="input_1" value="重 置"></td>
                    
    </tr>
                    
    <tr>
                      
    <td colspan="3" height="2"></td>
                    
    </tr>
                    
    <tr>
                      
    <td colspan="3"></td>
                    
    </tr>
            
    </table>

    prototype.js下载
  • 相关阅读:
    linux---shell数组
    linux---shell传递参数
    Windows mysql免安装版配置。(版本号-5.6.45);
    contos 6.9 和 centos7 配置docker?
    数据库表的演化过程
    docker简单介绍。
    Linux 配置 mycat 和 分库分表配置。
    Linux 配置mysql 免安装版。
    mycat 简单介绍
    kibana 对es的简单操作。
  • 原文地址:https://www.cnblogs.com/yesun/p/408942.html
Copyright © 2020-2023  润新知