使用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服务,并非 ...
随机推荐
- TP5.0学习历程(1)
验证码的使用 控制器代码如下: $captcha = new \think\captcha\Captcha(); if (!$captcha->check($data['code ...
- CDQZ Day4
NOIP 模拟题By liu_runda题目名称 数 论 题源程序文件名 number.cpp theory.cpp problem.cpp输入文件名 number.in theory.in prob ...
- 【后渗透】PowerSploit
1.下载安装:git clone https://github.com/mattifestation/PowerSploit.git 2.搭建web服务器(如172.16.12.2),将powersp ...
- 2017 FVDI2 ABRITES Commander with 18 Softwares FULL Version + FLY OBD Terminator + J2534 DrewTech Softwares
Highlights of FVDI2 Abrites Commander Full Version: 1.Free update online. 2.This is full version FVD ...
- 【OpenCV-Python】-图像平滑
原文为段立辉翻译,感谢Linux公社www.linuxidc.com此文档为自学转述,如有侵权请联系本人. 目标: • 学习使用不同的低通滤波器对图像进行模糊 • 使用自定义的滤波器对图像进行卷积(2 ...
- 百度ECharts数据绑定诀窍
百度Echarts的功能还是蛮好用的.. 不能说多好但是也不次.. 下边就分享一些数据绑定经验..对在处理过程中的思路有一些帮助... 报表里用的最多的可以说是 饼状图和柱形图.. 饼状图里当然是包括 ...
- putty访问虚拟机
从宿主机中用putty连接虚拟机中的Ubuntu Server. putty默认使用ssh方式连接,这需要在Ubuntu Server中安装ssh服务.使用命令sudo apt-get install ...
- 【Javascript】 DOM节点
HTML文档中一切都是节点! 整个文档是文档节点: 注释是注释节点: 每一个HTML元素都是一个元素节点: 元素内的文本内容是文本节点: 连元素的每一个属性都是一个属性节点. 看到这些是不是感觉很熟悉 ...
- 前端渲染模板(一):Thymeleaf
一.使用 本篇文章将以SpringBoot为框架来介绍Thymeleaf的用法. 1 资源文件的约定目录结构 Maven的资源文件目录:/src/java/resources spring-boot ...
- PHP学习9——MySQL数据库
主要内容: MySQL的启动 MySQL数据库操作 数据库表设计 创建和查看表 修改表结构 MySQL语句操作 数据库备份与恢复 PHP操作MySQL数据库 面向对象的数据库操作 MySQL数据库是目 ...