异步请求之用户注册

最新推荐文章于 2022-12-15 22:37:53 发布

魔数师

最新推荐文章于 2022-12-15 22:37:53 发布

阅读量528

点赞数

分类专栏： JavaScript Java MySql 文章标签：异步请求用户注册

本文链接：https://blog.csdn.net/qq_29534705/article/details/80687121

版权

这篇博客探讨了如何利用AJAX实现异步用户注册，以实现页面局部刷新并保持用户流畅体验。通过创建数据库表，设计注册页面，设置onblur事件触发函数，使用jQuery的AJAX发送异步请求，再到Servlet中处理查询，判断用户名是否可用，整个流程详细阐述了AJAX在用户注册中的应用。同时，博客还提及了原生JavaScript的实现方式以及关键的Java代码片段。

摘要由CSDN通过智能技术生成

什么是AJAX:
* AJAX:异步的 JavaScript And XML.
* 使用的是老的技术,用的是新的思想.
了解同步和异步的区别:
* 参考图一:
AJAX的功能:完成页面的局部刷新,不中断用户的体验.
重点内容
步骤分析:
【步骤一】：创建表和数据库:
【步骤二】：设计一个注册页面
【步骤三】：在用户名的文本框中使用onblur事件触发一个函数.
【步骤四】：使用JQ的AJAX完成异步操作,将文本框的值传入到Servlet中.
【步骤五】：Servlet中根据传入的用户名去数据库进行查询.
【步骤六】：查询到了说明用户名已经被占用,没有查询到说明用户名可以使用.
原生JavaScript实现请往前翻<——————————-
【前端代码：页面+jQuery异步请求】：


<script src="${pageContext.request.contextPath }/js/jquery-1.11.3.min.js"></script>
<script>
   $(function(){
     
       $("#subt").prop("disabled",false);
       $("#uname").blur(function(){
     
           var unameValue=$("#uname").val();
           $("#span_uname").html("");
           if(unameValue!=""||unameValue.length!=0){
               $.post("${pageContext.request.contextPath}/UserServlet",{
    "method":"checkUserName","uname":unameValue},function(data){
     
                   if(data=="0"){
                       $("#span_uname").html("<font color='green'>用户名不存在可以注册</font>");
                       $("#subt").prop("disabled",false);
                   }else if(data=="1"){
                       $("#span_uname").html("<font color='red'>用户名已经存在，请重新填写！</font>");
                       $("#subt").prop("disabled",true);
                   }
               });
           }

       });

   });
</script>
</head>
<body>
<fieldset><legend><font class="regist&#