jquery注册验证的写法
在做注册页面时会用到jquery验证注册信息,用户名,密码,邮箱,手机号的验证,比较简单的,新手莫怪...
<script>
function Name(){
var name = $("#name").val();
if(name=="") {
$("#tip1").html("<div style='color:#2ca9cc;font-size:14px;'>请输入用户名</div>");
}
}
function checkName(){
var name = $("#name").val();
if(name==""){
$("#tip1").html("<div style='color:red;font-size:14px;'>用户名不能为空</div>");
}else{
$("#tip1").html("");
}
}
function Password(){
var name = $("#password").val();
if(name=="") {
$("#tip2").html("<div style='color:#2ca9cc;font-size:14px;'>请输入密码</div>");
}
}
function checkPassword(){
var name = $("#password").val();
if(name==""){
$("#tip2").html("<div style='color:red;font-size:14px;'>密码不能为空</div>");
}else{
$("#tip2").html("");
}
}
function Email(){
var name = $("#email").val();
if(name=="") {
$("#tip3").html("<div style='color:#2ca9cc;font-size:14px;'>请输入邮箱</div>");
}
}
function checkEmail(){
var name = $("#email").val();
var zheng =/^[\w\.]+@[\w\.]+(\.\w+)+$/;
if(!zheng.test(name)){
$("#tip3").html("<div style='color:red;font-size:14px;'>邮箱格式错误</div>");
}else{
$("#tip3").html("");
}
}
function Phone(){
var name=$("#phone").val().length;
if( name ==0) {
$("#tip4").html("<div style='color:#2ca9cc;font-size:14px;'>请输入手机号</div>");
}
}
function checkPhone(){
var name=$("#phone").val().length;
if(name!==11) {
$("#tip4").html("<div style='color:red;font-size:14px;'>手机号位数不正确</div>");
}else{
$("#tip4").html("");
}
}
function check(){
$.ajax({
url: "./checkajax.php",
type: "post",
data:$('form').serialize(),
success: function (response) {
if (response == 1) {
$("#tip").html("用户名不能为空");
} else if (response == 2) {
$("#tip").html("密码不能为空");
} else if (response == 3) {
$("#tip").html("注册成功");
} else {
$("#tip").html("注册失败");
}
}
});
}
</script>
ajax提交数据到php文件进行判断
<?php
$pdo = new PDO("mysql:host=localhost;dbname=project",
"root","");
//对收集到数据进行验证
if($_POST){
//判断用户是否进行了数据提交
$username = isset($_POST["username"])?$_POST["username"]:'';
if($username==""){
echo 1; //response值为1 表示用户名为空
exit;
}
$password = isset($_POST["password"])?$_POST["password"]:'';
if($password==""){
echo 2; //response值为2 表示密码为空
exit;
}
$email = isset($_POST["email"])?$_POST["email"]:'';
$phone = isset($_POST["phone"])?$_POST["phone"]:'';
//将数据放入到数据库
$query = "insert into user
(username,password,email,phone)
values
(:username,:password,:email,:phone)";
//PDO通知mysql做准备
$statm = $pdo->prepare($query);
//绑定参数
$statm->bindParam(":username",$username);
$statm->bindParam(":password",$password);
$statm->bindParam(":email",$email);
$statm->bindParam(":phone",$phone);
//PDOStatement通知mysql执行
$statm->execute();
//根据被影响行数,判断执行是否成功
if($statm->rowCount()>0){
//执行成功
echo 3;
}else{
echo 4;//执行失败
}
}
这样就完成了注册验证。。。。
需要注意的是:
在给PHP文件传值的时候用到的 $.('form').serialize(),这个是方法的作用是获取表单内所有的值;
之前我以为PHP文件中用的是POST,不用传递值就可以,但事实上是不行的。
自己的一点小经验
jquery注册验证的写法的更多相关文章
- jQuery注册验证
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- thinkphp+jquery+ajax前后端交互注册验证
thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...
- jQuery失去焦点的时候注册验证
//注册验证$('form :input').blur(function () { if ($("#txtName").val() == "") { $(&qu ...
- jQuery Validate验证框架详解
转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...
- jQuery.validator 验证规则详解
前言:jQuery.validator是一款非常不错的表单验证插件,验证方式非常简单方便,它还对HTML5做了兼容处理,了解了验证规则,就基本掌握了它的使用,下面就让我一一道来 jQuery.vali ...
- 【转】jQuery Validate验证框架详解
jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...
- jQuery Validate验证框架详解(jquery.validate.min.js)
原博客 jQuery Validate验证框架详解 jQuery校验官网地址:https://jqueryvalidation.org/ 一.导入js库 <script type="t ...
- jQuery Validate验证框架详解(转)
jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...
- ASP.NET MVC的客户端验证:jQuery的验证
之前我们一直讨论的Model验证仅限于服务端验证,即在Web服务器根据相应的规则对请求数据实施验证.如果我们能够在客户端(浏览器)对用户输入的数据先进行验证,这样会减少针对服务器请求的频率,从而缓解W ...
随机推荐
- 第九章、import 和from ...import
目录 第九章.import 和from ...import 一.import和 from ...import ... 二.import模块名 第九章.import 和from ...import 一. ...
- Intellij IDEA显示调用时序图插件SequenceDiagram
1 推荐一个插件SequenceDiagram可以自动生成项目调用的时序图 安装好之后重启idea即可 2 使用,找到你要查询的方法
- redis 的启动、关闭 判断其是否在运行中
#检查后台进程是否正在运行 ps -ef |grep redis ps aux | grep redis #检测6379端口是否在监听 netstat -lntp | grep 6379 #使用配置文 ...
- Redis02——Redis单节点安装
Redis单节点安装 一.Redis的数据类型 string hash list set zset 二.安装 2.1.下载 wget http://download.redis.io/releases ...
- 移动端css适配
/* iphoneX.iphoneXs */ @media only screen and (device-width: 375px) and (device-height: 812px) and ( ...
- java线程基础巩固---同步代码块以及同步方法之间的区别和关系
在上一次中[http://www.cnblogs.com/webor2006/p/8040369.html]采用同步代码块的方式来实现对线程的同步,如下: 对于同步方法我想都知道,就是将同步关键字声明 ...
- django虚拟环境搭建
windows建立Django项目(建立虚拟环境,安装virtualenv,安装Django,创建项目) 目的:为每一个项目单独配置一个环境例如:项目一使用django1.10, 项目二使用djang ...
- python+Appium自动化:Appium元素检测
appium模拟用户的真实操作,如果用户第一次进入app或许会弹出一些更新提示,或者是引导页面,但是下一次开启app时则没有引导页这些界面,这时,脚本中又肯定不考虑用两套代码来进行维护,此时如何应对这 ...
- shell进阶--流程
由于条件判断和循环跟其他语言都大同小异,学过编程的话很好理解,这里只贴出格式,不具体写用法了.(select菜单会详细讲一下) 条件判断 if条件判断 普通if条件判断: 嵌套if条件判断: 循环 f ...
- 今日理解之js
JavaScript 是前端的一门编程语言(也是有逻辑) node.js 支持前端js代码 跑在后端服务器上 Js跟Java什么关系? Js跟Java半毛钱关系都没有!!! 原因是当初Java特别火 ...