【jquery】ajax实现用户名验证

最新推荐文章于 2021-06-04 20:00:17 发布

weixin_34378969

最新推荐文章于 2021-06-04 20:00:17 发布

阅读量77

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/zhiqiangwang/blog/787392

版权

2019独角兽企业重金招聘Python工程师标准>>>

1.导入jQuery库
2.获取name="username" 的节点:UserName
3.为username添加change响应函数
3.1.获取username的value属性值，去除前后前后空格且不为空，这边发送ajax请求
3.2.发送ajax 请求检验username是否可用
3.3.在服务端直接返回html的片段：<font color="red">用户名可用</font>
3.4.在客户端浏览器把服务端返回的结果之间添加到#message的html中

[JavaScript]代码

<script type="text/javascript">
$(function(){
    $(":input[name='username']").change(function(){
        var val=$(this).val();
        val=$.trim(val);
        if(val!=""){
            var url="url";
            var args={"username":val,"time":new Date()};
            $.post(url,args,function(data){
                $("#message").html(data);
            });
        }
    });
});
</script>

[HTML]代码

<body>
   <form action="" method="post">
     UserName:<input type="text" name="username"/><br/>
     <div id="message"></div><br/>
     <input type="submit" value="Submit"/>
   </form>
</body>

转载于:https://my.oschina.net/zhiqiangwang/blog/787392