使用JS完成注册表单的数据校验
1、前台校验
防君子不防小人
JavaScript被设计用来向HTML页面添加交互行为
JavaScript是一种脚本语言(脚本语言是一种轻量级的编程语言)
JavaScript由数行可执行计算机代码组成
JavaScript通常直接嵌入HTML页面
JavaScript是一种解释性语言(就是说,代码执行不进行预编译)
所有的人无需购买许可证均可使用JavaScript
Java和JavaScript的区别?
它们没有关系,就像雷锋和雷峰塔
JavaScript的作用
HTML是整个网站的骨架
CSS是对整个网站骨架的内容进行美化(修饰)
JavaScript能够让整个页面具有动态效果
JavaScript的组成部分:
1、ECMAScript核心
它是整个JavaScript的核心,包含(基本语法、变量、关键字、保留字、数据类型、语句、函数等等)
2、DOM文档对象模型
它包含整个HTML页面的内容
3、BOM浏览器对象模型
它包含整个浏览器相关内容
Javascript语法
1、区分大小写
2、变量是弱类型的
3、每行结尾的分号可有可无
4、注释与Java、C和PHP语言的注释相同
5、括号表示代码块
JavaScript的变量
变量可以不用声明,变量是弱类型。统一使用var来定义!定义变量的时候不要使用关键字和保留字。
关键字
ECMAScript有5种原始类型,即Undefined、Null、Boolean、Number和String。
引用数据类型:存在很多种,每种都是object对象
可以使用typeof查看数据类型,使用instanceof判断变量数据类型
null和undefined的区分
null:对象不存在
undefined:对象存在,访问属性或者方法不存在(对象未初始化)
获取元素内容
获取元素
document.getElementById("id名称");
如果id是一个字符串,那么必须加上引号,如果是一个变量那么不需要
获取元素里面的值
document.getElementById("id名称").value;
JavaScript事件
表单提交事件:onsubmit
JavaScript的输出
警告框:alert();
向页面指定位置写入内容:innerHTML(属性);
向页面写入内容:document.write("");
3步骤分析
第一步:确定事件(onsubmit)并为其绑定一个函数
第二步:书写这个函数(获取用户输入的数据)<获取数据时需要在指定位置定义一个id>
第三步:对用户输入的数据进行判断
第四步:数据合法(让表单提交)
第五步:数据非法(不让表单提交)给出错误提示信息
如何控制表单提交?
关于事件onsubmit:一般用于表单提交的位置,那么需要定义函数的时候给出一个返回值。onsubmit = return checkForm();
代码的实现
2、后台校验
使用JS完成注册表单的数据校验的更多相关文章
- js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题
js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...
- JS判定注册表单的几个方式 及 Ajax进行用户名存在判定
最近感觉不赶紧把代码逻辑记一下梳理一下,再做的时候就容易进入"逻辑误区". 有个表单,简单点. <!DOCTYPE html> <!-- 注册表单验证,用户名格式 ...
- 模拟js中注册表单验证
示例1 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- Laravel Form 表单的数据校验
例如,要使用手机号加验证码的方式提供登录网站的功能,那么在处理前端提交的 form 表单时,就不得不对提交的手机号及验证码做基本的数据校验. 手写规则,非常浪费时间.使用 laravel 内置的 va ...
- js获取form表单所有数据
代码如下: <script type="text/javascript"> // 获取指定form中的所有的<input><select>对象 ...
- 第一百六十节,封装库--JavaScript,ajax注册表单到数据库
封装库--JavaScript,ajax注册表单到数据库 效果图 前台js var biaodan = $().xu_lie_biao_dan($('form').sh_jd()); //序列化获取表 ...
- ajax 提交 注册表单 到MySQL数据库
今天按照要求,要做一个登陆.注册表单,本来样式做好就行了,本来咱就是干前端的,但让咱自己都没想到的是,不到一个小时竟然都干完了,实在闲的蛋疼,就想到链接数据库玩,遥想当年,毕竟咱也是写过后台的,哪知, ...
- 如何利用WordPress创建自定义注册表单插件
来源:http://www.ido321.com/1031.html 原文:Creating a Custom WordPress Registration Form Plugin 译文:创建一个定制 ...
- UX设计秘诀之注册表单设计,细节决定成败
以下内容由摹客团队翻译整理,仅供学习交流,摹客iDoc是支持智能标注和切图的产品协作设计神器. 说实话,现实生活中,又有多少人会真正喜欢填写表格?显然,并不多.因为填写表单这样的网页或App服务,并非 ...
随机推荐
- NOIP前的模板
1.筛\(phi\) \(logn\)求少数\(phi\) inline int phi(R int x){ R int res=x,tmp=x; for(R int i=2;i*i<=x;i+ ...
- 时区缩写 UTC, CST, GMT, CEST 以及转换
UTC是协调世界时(Universal Time Coordinated)英文缩写,是由国际无线电咨询委员会规定和推荐,并由国际时间局(BIH)负责保持的以秒为基础的时间标度.UTC相当于本初子午线( ...
- AlvinZH掉坑系列讲解(背包DP大作战H~M)
本文由AlvinZH所写,欢迎学习引用,如有错误或更优化方法,欢迎讨论,联系方式QQ:1329284394. 前言 动态规划(Dynamic Programming),是一个神奇的东西.DP只能意会, ...
- springBoot 实现中文国际化
一:实现效果如下: 二 SpringBoot 国际化配置 1.创建国际化配置文件(3个): messages.properties messages.user.name=用户名 messages.us ...
- python四则运算2.0
github项目地址: https://github.com/kongkalong/python PSP 预估耗时(分钟) Planning .Estimate 48*60 Development . ...
- MM 后台配置(转)
本文转自:https://www.cnblogs.com/yanglikun/p/4124797.html 一.全局配置 1.一般配置 SPRO->SAP NETWEAVER -> GEN ...
- scrapy源码分析(转)
记录一下两个讲解scrapy源码的博客: 1.http://kaito-kidd.com/2016/11/21/scrapy-code-analyze-component-initialization ...
- 仔细说明CLOSE_WAIT状态的原因
CLOSE_WAIT状态!!! 服务器收到客户端FIN报文后 服务器端口回复了ack,没有回复FIN报文. 1 说明客户端后面不会再向服务器发送用户层的数据了, 2 客户端 没有回复FIN 报文嘛 ...
- KafKa 启动
Zookeeper 运行kafka需要使用Zookeeper,所以要先启动Zookeeper,如果没有Zookeeper,可以使用kafka自带打包和配置好的Zookeeper 1.进入kafka的b ...
- oracle 处理锁表sql
declare --类型定义 cursor c_cur is --查询锁表进程 SELECT object_name, machine, s.sid, s.serial# FROM gv$locked ...