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 ...
随机推荐
- shell脚本视频学习1
一.知识点:变量,参数传递 练习1:使用shell脚本,输出当前所在的目录 练习2:计算/etc目录下有多少个文件,用shell脚本实现 ls -l--->数一下, ls -l|wc -l ( ...
- 基于Java使用Flink读取CSV文件,针对批处理,多表联合两种方式Table类和Join方法的实现数据处理,再入CSV文件
Maven依赖 源头 <dependencies> <dependency> <groupId>org.projectlombok</groupId> ...
- Java学习笔记【二、标识符、关键字、数据类型】
基础语法 大小写敏感 类名用帕斯卡命名法 方法名用驼峰命名法 所有java程序,源码文件名须与类名一致 所有java程序,均以 public static void main(string []arg ...
- 并发编程:生产消费模型、死锁与Rlock、线程、守护线程、信号量、锁
一.生产者消费者模型1 二.生产者消费者模型2 三.守护线程 四.常用方法 五.启动线程的另一种方式 六.锁 七.锁死 八.死锁 九.单个锁能不能死锁 十.信号旗 一.生产者消费者模型1 import ...
- onItemSelected 获取选中的 信息 3种方法
@Override public void onItemSelected(AdapterView<?> parent, View view, int position, long id) ...
- JS批量绑定事件
,,,,] for(var j in a){ $("#" + j).click(function () { // 前提是先动态生成id是j的标签 var id_cm = $(thi ...
- YII2-按需加载并管理静态资源(CSS,JS)
参考博客: https://segmentfault.com/a/1190000003742452#articleHeader5
- mongodb单机搭建
参考网站:http://www.runoob.com/mongodb/mongodb-linux-install.html 1.下载 https://www.mongodb.com/download- ...
- SpringBoot项目 设置全局跨域
package com.nf147.policy_project; import org.springframework.stereotype.Component; import javax.serv ...
- Java 中 && 和 & 的区别
在java中&和&&都属于逻辑运算符,都是判断两边条件为真时为真,否则则为假. 在程序中: int i = 1; if ((i++ > 1) & (i++ > ...