zoukankan      html  css  js  c++  java
  • 利用jQuery和Ajax实现检测用户名是否已经被注册

    这是一个jQuery和Ajax的很基础的应用,是我出去面试时的一个面试题。当时脑子有点懵想了好久才知道该怎么去实现,现在回来再看了下书好好总结一下这个东西。

    首先新建一个html文件,只有简单的几行代码,创建一个很基本的包含用户名和密码 以及注册按钮的文本框。代码如下 只简单说明问题 多余的暂时不加。

    <form>
            用户名:<input type="text" cols="20" name="Name" id="Name">
            <span id="tishi"></span><br/>
            密码:<input type="pswd" name="pswd"><br/>
            <input type="submit" value="注册">
        </form>

    用户名<input>后面的span 是用来添加提示信息的 如果该用户名没有被注册 正常 显示 如果不能显示 获取到id 向其插入警告字体

    要用jQuery加Ajax最重要的是什么,没错就是引入jQuery库。。接下来就是得引入jQuery库,简直说的太有道理哈哈哈

    接下来就是jQuery代码

    <script type="text/javascript">
            $(document).ready(function(){
                check();
            });
            function check(){
                $('#Name').blur(function(){
                    var a=$(this).val();
                    var changUrl="yanzheng.php?action=check&name=a";
                    $get(changUrl,function(str){
                        if(str=='1'){
                            $('#tishi').html("您输入的用户名已存在,请重新输入");
                        }
                    });
                });
            }
        </script>

    给文本框设置了Id之后 当用户失去焦点 就去调用check()函数 进行验证

    获取到文本框当前的值,将其通过$get()方法提交给一个验证的php代码,通过php对后台数据进行验证处理,若在数据库查询到该用户名,则返回1,否则返回0。html页面拿到该值进行判断处理若$get到的值是1,则在<span>元素里插入提示您“您的用户名已存在,请重新输入”。如果返回值是0,则说明该用户名可以注册。继续进行。php代码我也就不贴了。

    很基础的东西,往往有时意想不到的犯错,前几天去面试试了把水,自己总结了好多经验,很有收获,还是得去学习,很多基础东西你不去运用过一段时间就忘记了,自己很有感受。多看书,多敲代码,多思考。加油,我爱前端。I am a web developer,I love web front-end.

  • 相关阅读:
    抽象类和接口
    【转载】Java 透析C/S和B/S结构
    java中的基本数据类型
    java之IO流详解(一)
    Yearning和inception搭建MySQL审核平台
    一个适合变化的产品部署集成包(nginx+jdk+tomcat+nodejs+mysql+redis+mongo+MYSQL主主(读写分离)集群建立+代码包+持续上线+备份)
    CPU计算密集型和IO密集型
    ansible结合SHELL搭建自己的CD持续交付系统
    JENKINS系统的安装部署
    DATAGUARD实施文档
  • 原文地址:https://www.cnblogs.com/huangzhilong/p/4943821.html
Copyright © 2011-2022 走看看