在做注册页面时会用到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注册验证的写法的更多相关文章

  1. jQuery注册验证

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. thinkphp+jquery+ajax前后端交互注册验证

    thinkphp+jquery+ajax前后端交互注册验证,界面如下 register.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1. ...

  3. jQuery失去焦点的时候注册验证

    //注册验证$('form :input').blur(function () { if ($("#txtName").val() == "") { $(&qu ...

  4. jQuery Validate验证框架详解

    转自:http://www.cnblogs.com/linjiqin/p/3431835.html jQuery校验官网地址:http://bassistance.de/jquery-plugins/ ...

  5. jQuery.validator 验证规则详解

    前言:jQuery.validator是一款非常不错的表单验证插件,验证方式非常简单方便,它还对HTML5做了兼容处理,了解了验证规则,就基本掌握了它的使用,下面就让我一一道来 jQuery.vali ...

  6. 【转】jQuery Validate验证框架详解

    jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...

  7. jQuery Validate验证框架详解(jquery.validate.min.js)

    原博客 jQuery Validate验证框架详解 jQuery校验官网地址:https://jqueryvalidation.org/ 一.导入js库 <script type="t ...

  8. jQuery Validate验证框架详解(转)

    jQuery校验官网地址:http://bassistance.de/jquery-plugins/jquery-plugin-validation 一.导入js库 <script type=& ...

  9. ASP.NET MVC的客户端验证:jQuery的验证

    之前我们一直讨论的Model验证仅限于服务端验证,即在Web服务器根据相应的规则对请求数据实施验证.如果我们能够在客户端(浏览器)对用户输入的数据先进行验证,这样会减少针对服务器请求的频率,从而缓解W ...

随机推荐

  1. Java高并发程序设计学习笔记(十一):Jetty分析

    转自:https://blog.csdn.net/dataiyangu/article/details/87894253 new Server()初始化线程池QueuedThreadPoolexecu ...

  2. mongodb启用auth,使用密码登录

    更新操作: db.users.update({'currentVersion':3},{$set:{'currentVersion':5}}) 首先安装下载(略过) mongod 启动服务,有多重启动 ...

  3. 解决xshell连接不上阿里云服务器问题

    最近购买了阿里云服务器准备玩玩,但是使用xshell连接阿里云服务器时,系统一直提示“Connection established. To escape to local shell, press ' ...

  4. BLE 5协议栈-通用访问规范层(GAP)

    文章转载自:http://www.sunyouqun.com/2017/04/ 通用访问规范GAP(Generic Access Profile)是BLE设备内部功能对外的接口层,它规定了三个方面:G ...

  5. SeekBar 滚动条

    原seek_thumb样式----------------------------------------------------------------------↑↑↑↑↑ android:thu ...

  6. Mike and Feet CodeForces - 548D (单调栈)

    Mike is the president of country What-The-Fatherland. There are n bears living in this country besid ...

  7. 【NOIP2017】小凯的疑惑

    原题: 小凯手中有两种面值的金币,两种面值均为正整数且彼此互素.每种金币小凯都有 无数个.在不找零的情况下,仅凭这两种金币,有些物品他是无法准确支付的.现在小 凯想知道在无法准确支付的物品中,最贵的价 ...

  8. 用github page为自己的项目编写文档

    ———————————————— 一.用md文件建立网页这一步要做的就是把四个实验报告做出来.1.首先为了方便管理,我们在ML下创建一个名为docs的文件夹. 2.然后在修改设置,让github从do ...

  9. CF892E Envy[最小生成树]

    题意:有一张 $n$ 个点$ m $条边的连通图.有$Q$ 次询问.每次询问给出 $k[i]$ 条边,问这些边能否同时出现在一棵最小生成树上.$n,m,Q,\sum k\le 500000$. 这题利 ...

  10. mysql5.7 环境准备

    原文源自:https://www.cnblogs.com/activiti/p/7810166.html 操作系统为centos7 .修改 /etc/my.cnf,在 [mysqld] 小节下添加一行 ...