Home > php教程 > php手册 > php+jquery+ajax实现用户名验证

php+jquery+ajax实现用户名验证

WBOY
Release: 2016-06-13 10:45:07
Original
854 people have browsed it

这是我今天无意间看到的一些东西,第一次接触jquery,当作我的一个意外收获写出来,只是初学者的了解。。。

从认识jquery开始写这个验证。。。

大多数情况下,jquery代码的编写,都要求我们将jquery的代码放在以下三种中任一个function里。

有三种写法,同样效果,有点像Window.onload,但也有不同,就是window.onload是页面加载完后才会执行,而$(document).ready()方法只是等所有标签加载完后,就进行操作,还有$(document).ready()可以多次调用,而window.onload不可以,会被后一个调用所覆盖。。。

第一种:$(document).ready(function(){.....});

第二种:$().ready(function(){......});

第三种:$(function(){......});

注:通过jQuery中的$(document).ready()方法注册的事件处理程序,只要在DOM完全就绪时,就可以调用了,比如一张图片只要php+jquery+ajax实现用户名验证标签完成,不用等这个图片加载完成,就可以设置图片的宽高的属性或样式等。

再看ajax在jquery中如何操作?

ajax通过两种方式传值:get/post

【get方式】

var changeUrl = "CheckUser.php?uName="+name; //跳转到判断页面

  $.get(changeUrl,function(result){ //运行ajax,进入url页面,返回result

    //通过result返回值,输出描述信息

} www.2cto.com

【post方式】

 var username  = $(this).val();

var changeUrl = "CheckUser.php";

$.post(changeUrl,{name:username},function(result){ ...}

跳转到CheckUser.php页面后通过get/post接收并从数据库中判断是否存在,然后返回一个值即可。。。

html代码:用户名:

jquery代码:$("#userName").blur(function(){

  var username  = $(this).val();
  var changeUrl = "CheckUser.php"; //跳转到判断页面

//下面是运行ajax,进入changeUrl页面,传入name,返回result

 $.post(changeUrl ,{name:username},function(result){

   if(result == '1'){
    $("#Info").html("用户名存在!");
   }else{
    $("#Info").html("可以注册!");

} }  })

CheckUser.php

if($_POST['name']){//接收post传过来的值

 $username = trim($_POST['name']);

//进行判断,本来是要从数据库中取的,我偷懒了一下,只是测试。。。

 if($username == "admin"){
 echo '1';
 }else{
 echo '0';
 }}
?>

通常会看很多,可就是不怎么会写出来,可能因为这次是个意外,所以就不假思索的写啦,害怕意外会消失。。呵呵。。。

 

 

本文出自 “恒” 博客

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Recommendations
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template