用ajax验证用户名是否可用

testuid.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script src="../jquery-1.11.2.min.js"></script>

<title>无标题文档</title>

</head>

<body>

<input type="text" id="uid" />

<span id="ts"></span>

</body>
<script type="text/javascript">

    $("#uid").blur(function(){//blur表示失去焦点时触发

        //取用户名

        var uid = $("#uid").val();

        //调ajax

        $.ajax({

            url:"uidchuli.php",

            data:{u:uid},

            type:"POST",

            dataType:"TEXT",

            success: function(data){

                    if(data>0)

                    {

                        $("#ts").html("该应户名已存在");

                        $("#ts").css("color","red");

                    }

                    else

                    {

                        $("#ts").html("该应户名可用");

                        $("#ts").css("color","green");

                    }

                }

            });

        })

</script>
</html>

uidchuli.php

<?php

$uid = $_POST["u"];

include("../DBDA.class.php");

$db = new DBDA();

$sql = "select count(*) from login where username='{$uid}'";

echo $db->StrQuery($sql);

动态调用数据库，搜索框里输入关键字，内容中含关键字的自动出现在输入框下面。

list.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script src="../jquery-1.11.2.min.js"></script>

<title>无标题文档</title>

<style type="text/css">

*{ margin:0px auto; padding:0px}

.l{ width:200px; height:30px; text-align:center; line-height:30px; vertical-align:middle; border-bottom:1px solid #60F}

</style>

</head>

<body>

<br />

<div style="width:200px; height:35px; border:2px solid #60F">

    <input type="text" id="name" style="width:196px; height:31px" />

</div>

<div id="list" style="width:200px; height:500px; border:2px solid #60F; border-top:0px"></div>

</body>
<script type="text/javascript">

$("#name").keyup(function(){

    //取名称

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

    if(n!="")

    {

        //调ajx

        $.ajax({

            url:"listchuli.php",

            data:{n:n},

            type:"POST",

            dataType:"TEXT",

            success: function(data){

                var sz = data.split("|");

                var str = "";

                for(var i=0;i<sz.length;i++)

                {

                    str = str+"<div class='l'>"+sz[i]+"</div>";

                }

                $("#list").html(str);

                }

            });

        }

        else

        {

            $("#list").html("");

        }

    })

</script>
</html>

listchuli.php

<?php

$name = $_POST["n"];

include("../DBDA.class.php");

$db = new DBDA();

$sql = "select areaname from chinastates where areaname like'%{$name}%'";

echo $db->StrQuery($sql);

11.10 （下午）开课二个月零六天（ajax验证用户名，ajax调数据库）的更多相关文章

  1. 11.10 （上午）开课二个月零六天（ajax基础，ajax做登录）

    test.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww ...

  2. 11.7 （下午）开课二个月零三天 （PDO）

    PDO访问方式操作数据库   mysqli是专门访问MySQL数据库的,不能访问其它数据库.PDO可以访问多种的数据库,它把操作类合并在一起,做成一个数据访问抽象层,这个抽象层就是PDO,根据类操作对 ...

  3. 11.8 开课二个月零四天 （Jquery取属性值，做全选，去空格）

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  4. 11.11 开课二个月零七天（ajax和bootstrp做弹窗）

    1.用ajax做弹窗显示信息详情 nation.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN&qu ...

  5. 11.8 开课二个月零四天 （Jquery）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  7. 2、JavaScript 基础二 （从零学习JavaScript）

     11.强制转换 强制转换主要指使用Number.String和Boolean三个构造函数,手动将各种类型的值,转换成数字.字符串或者布尔值. 1>Number强制转换 参数为原始类型值的转换规 ...

  8. ubuntu 11.10 安装apache2 tomcat6

    ubuntu 11.10 安装apache2 tomcat6 导读 Tomcat是Apache 软件基金会(Apache Software Foundation)的Jakarta 项目中的一个核心项目 ...

  9. 显示 Ubuntu 11.10 的 终端窗口

    显示 Ubuntu 11.10 的 终端窗口 一.点击左上角的图标 -> 在search框里搜索termial . 二.快捷键:Ctrl+Alt+t.

随机推荐

  1. TCP连接之报文首部

    在面试时,会经常被问到TCP报文的一些细节,可以说TCP报文是不少企业用来考察面试者对网络的掌握程度的一道题目. TCP连接作为网络传输的一个环节,是不可或缺的一部分.例如,OSI七层模型的应用层HT ...

  2. python并发编程之线程

    操作系统线程理论 参考资料:http://www.cnblogs.com/Eva-J/articles/8306047.html 线程和python 理论知识 全局解释器锁GIL Python代码的执 ...

  3. HDU ACM 1869 六度分离（Floyd）

    六度分离 Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  4. FLask上传文件

    目录 Flask上传文件 改进上传 上传进度条 一个更简便的方案 Flask上传文件 文件上传的基本原理实际上很简单,基 本上是: 一个带有 enctype=multipart/form-data 的 ...

  5. Windows 下配置 Apache 支持 https

    1.打开cmd ,输入  F: // 切换到Apache安装路径,我的Apache安装目录在 F盘 2.cd F:\Apache\bin 3.set "openssl_conf = F:\A ...

  6. Beta冲刺（5/5）（麻瓜制造者）

    今日已完成 邓弘立:完成了图书馆新功能 符天愉:完成管理员用户查询,删除商品/需求以及注销功能 江郑:进行后台管理员的web开发 刘双玉:修改了商品搜索中数据返回类型不对的错误,添加了图书馆查询接口 ...

  7. [方法提炼] 获取Android设备序列号方法

    通过这个方法可以检测设备是否连接成功,如果有一台或者多台设备,可以将所有设备序列号全部输出 # -*- coding:utf-8 -*- import os def attachDeviceList( ...

  8. 【错误记录】PowerShell 超级无语的语法错误(令人怀疑人生)

    曾经做过测试,本文是本章优秀测试人员的精神,必须定位到原因,不然吃不下饭.其实可以很容易绕过这种问题. 环境: PowerShell 5.1.16299.64 Windows 10 现有代码如下: # ...

  9. CPU的内部架构和工作原理-原文

    CPU从逻辑上可以划分成3个模块,分别是.和,这三部分由CPU内部总线连接起来.如下所示: 控制单元:控制单元是整个CPU的指挥控制中心,由指令寄存器IR(Instruction Register). ...

  10. 使用KVM虚拟机遇到的问题（持续更新）

    1.qemu-kvm.kvm.qemu 和 qemu-system-x86_64四种命令的差别 qemu 和 qemu-system-x86_64:启动qemu虚拟机的命令,x86_64为64位系统时 ...