JS技术

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

字号+ 作者:H5之家 来源:H5之家 2015-10-07 16:08 我要评论( )

修改后的prototype.js,增加进度条和验证输入框,学习修改后的prototype.js,增加进度条和验证输入框,修改后的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'> 登录成功,正在载入,请稍候..");

      //login success
      location.href='admin_index.htm';
    }
    else
    {
      progressBar.isNeedConfirmButton = true;
      progressBar.isNeedProgressBar = false;
      progressBar.focusItem = "username";
      progressBar.SetStatus("<img src='../images/error.gif'> 对不起,登录失败!" + 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'> 对不起,登录失败!" + err.message);

      $('btnOK').disabled = false;
    }
  }
</script>

 

<table cellpadding="3" cellspacing="0">
              <tr>
                <td colspan="3"></td>
              </tr>
              <tr>
                <td>用户名:</td>
                <td colspan="2">
                  <input type="text" tabindex="1" chname="用户名" notempty="true" size="20" /></td>
              </tr>
              <tr>
                <td>密 码:</td>
                <td colspan="2"><input type="password" tabindex="2" chname="密码" notempty="true" size="20" /></td>
              </tr>
              <tr>
                <td>验证码:</td>
                <td colspan="2">
                  <input type="text" tabindex="3" chname="验证码" notempty="true" onKeyUp="value=value.replace(/[^\d]/g,'')"/>
                  <img alt="验证码" src="../rnd.do?type=admin_rnd" usemap="absmiddle"/></td>
              </tr>             
                <tr>
                  <td>&nbsp;</td>
                  <td><input type="submit" value="登 录" tabindex="4"></td>
                    <td><input type="reset" value="重 置"></td>
                </tr>
                <tr>
                  <td colspan="3"></td>
                </tr>
                <tr>
                  <td colspan="3"></td>
                </tr>
        </table>

prototype.js下载

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Swift 2.0学习笔记(Day48)——类型检查与转换 - 关东升 - 博客频道 - CSDN.NET 关东升 iO

    Swift 2.0学习笔记(Day48)——类型检查与转换 - 关东升 - 博客频道

    2015-12-14 18:16

  • 查找栈的增长方向的分析及C代码实现 - 周兆熊的专栏 - 博客频道 - CSDN.NET 周兆熊的专栏 2015年度“博

    查找栈的增长方向的分析及C代码实现 - 周兆熊的专栏 - 博客频道 - CS

    2015-12-14 15:15

  • JS开发者调查 - FedFun - 博客频道 - CSDN.NET FedFun 爱前端,乐分享,前端痴王海庆的博客!

    JS开发者调查 - FedFun - 博客频道 - CSDN.NET FedFun 爱前端,乐分

    2015-12-13 11:08

  • js事件与处理_Javascript教程

    js事件与处理_Javascript教程

    2015-10-10 15:06

网友点评
k