js表单登陆验证示例


Posted in Javascript onOctober 19, 2016

本文实例讲述了js表单登陆验证的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>项目后台管理系统</title>
<link rel="stylesheet" href="__PUBLIC__/css/login.css" />
<script type="text/javascript" src="__PUBLIC__/js/jquery.min.js"></script>
<script type="text/javascript">
function $(id)
{
  return document.getElementById(id);
}
//验证姓名
function checkname(){
  var name=$("admin_name").value;
  if(name=='')
  {
   $('s1').innerHTML='姓名不能为空';
   $('s1').style.color='red';
   return false;
  }
  else
  {
    $('s1').innerText='ok';
    $('s1').style.color='green';
    return true;
  }
}
//验证密码
function checkpwd(){
  var password=$("password").value;
  if(password=='')
  {
   $('s2').innerHTML='密码不能为空';
   $('s2').style.color='red';
   return false;
  }
  else
  {
    $('s2').innerHTML='ok';
    $('s2').style.color='green';
    return true;
  }
}
//验证所有表单提交
function checkall()
{
  if(checkname()&&checkpwd())
  {
    return true;
  }
  else
  {
    return false;
  }
}
</script>
</head>
<body class="b">
<div class="lg">
<form action="__URL__/dologin" method="POST" onsubmit="return checkall();">
  <div class="lg_top"></div>
  <div class="lg_main">
    <div class="lg_m_1">
    <input name="admin_name" value="" class="ur" id="admin_name" onblur="checkname();"/><span id='s1'></span>
    <input name="password" type="password" value="" class="pw" id="password" onblur="checkpwd();"/><span id='s2'></span>
    </div>
  </div>
  <div class="lg_foot">
  <input type="submit" value="Login In" class="bn" /></div>
</form>
</div>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
js继承 Base类的源码解析
Dec 30 Javascript
使用jquery修改表单的提交地址基本思路
Jun 04 Javascript
javascript实现框架高度随内容改变的方法
Jul 23 Javascript
基于jQuery仿淘宝产品图片放大镜特效
Oct 19 Javascript
JavaScript中递归实现的方法及其区别
Sep 12 Javascript
JS库中的Particles.js在vue上的运用案例分析
Sep 13 Javascript
vuejs使用递归组件实现树形目录的方法
Sep 30 Javascript
AngularJS实现自定义指令及指令配置项的方法
Nov 20 Javascript
node-red File读取好保存实例讲解
Sep 11 Javascript
vue中使用rem布局代码详解
Oct 30 Javascript
微信小程序如何实现精确的日期时间选择器
Jan 21 Javascript
Webpack的Loader和Plugin的区别
Nov 09 Javascript
jQuery插件ajaxFileUpload异步上传文件
Oct 19 #Javascript
Angular和百度地图的结合实例代码
Oct 19 #Javascript
Bootstrap Table使用方法解析
Oct 19 #Javascript
JavaScript 中 avalon绑定属性总结
Oct 19 #Javascript
Ubuntu 16.04 64位中搭建Node.js开发环境教程
Oct 19 #Javascript
jQuery实现点击任意位置弹出层外关闭弹出层效果
Oct 19 #Javascript
JavaScript重定向URL参数的两种方法小结
Oct 19 #Javascript
You might like
虹吸壶是谁发明的?煮出来的咖啡好喝吗
2021/03/04 冲泡冲煮
兼容各大浏览器带关闭按钮的漂浮多组图片广告代码
2014/06/05 PHP
php之Smarty模板使用方法示例详解
2014/07/08 PHP
在WordPress中使用PHP脚本来判断访客来自什么国家
2015/12/10 PHP
深入分析PHP优化及注意事项
2016/07/04 PHP
Laravel自动生成UUID,从建表到使用详解
2019/10/24 PHP
PHP使用gearman进行异步的邮件或短信发送操作详解
2020/02/27 PHP
纯js模拟div层弹性运动的方法
2015/07/27 Javascript
jQuery仅用3行代码实现的显示与隐藏功能完整实例
2015/10/08 Javascript
微信开发 使用picker封装省市区三级联动模板
2016/10/28 Javascript
jQuery实现两个select控件的互移操作
2016/12/22 Javascript
Node.js复制文件的方法示例
2016/12/29 Javascript
微信小程序自定义组件
2017/08/16 Javascript
angularJS开发注意事项
2018/05/26 Javascript
微信小程序实现即时通信聊天功能的实例代码
2018/08/17 Javascript
js中this的指向问题归纳总结
2018/11/28 Javascript
自定义Vue组件打包、发布到npm及使用教程
2019/05/22 Javascript
运用js实现图层拖拽的功能
2019/05/24 Javascript
JavaScript中的this妙用实例分析
2020/05/09 Javascript
[56:12]LGD vs Optic Supermajor小组赛D组胜者组决赛 BO3 第一场 6.3
2018/06/04 DOTA
[47:03]完美世界DOTA2联赛PWL S3 Galaxy Racer vs Phoenix 第二场 12.10
2020/12/13 DOTA
Python使用pygame模块编写俄罗斯方块游戏的代码实例
2015/12/08 Python
详解如何用TensorFlow训练和识别/分类自定义图片
2019/08/05 Python
解决django同步数据库的时候app models表没有成功创建的问题
2019/08/09 Python
python连接、操作mongodb数据库的方法实例详解
2019/09/11 Python
40个你可能不知道的Python技巧附代码
2020/01/29 Python
Python for循环通过序列索引迭代过程解析
2020/02/07 Python
解决安装新版PyQt5、PyQT5-tool后打不开并Designer.exe提示no Qt platform plugin的问题
2020/04/24 Python
谈谈python垃圾回收机制
2020/09/27 Python
使用Python实现音频双通道分离
2020/12/25 Python
网站域名和主机:Domain.com
2019/04/01 全球购物
微观物理专业自荐信
2014/01/26 职场文书
投资意向书范本
2014/04/01 职场文书
mysql升级到5.7时,wordpress导数据报错1067的问题
2021/05/27 MySQL
python实现剪贴板的操作
2021/07/01 Python
Pygame Draw绘图函数的具体使用
2021/11/17 Python