使用jquery+ajax方式实现用户注册时，检测用户名是否存在

最新推荐文章于 2024-05-15 23:46:08 发布
最新推荐文章于 2024-05-15 23:46:08 发布
阅读量4.5k 收藏 4
点赞数 1
分类专栏： php

使用jquery+ajax方式实现用户注册时，检测用户名是否存在 

 

[html]  view plain  copy
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2.   
  3. <html xmlns="http://www.w3.org/1999/xhtml">  
  4. <head>  
  5.     <title>使用jquery+ajax方式实现用户注册时，检测用户名是否存在</title>  
  6.     <style type="text/css">  
  7.       /*  
  8.         当用户没有输入用户名，设置text边框为红色，否则为默认样式。  
  9.       */  
  10.     .UserText  
  11.     {  
  12.       border:1px solid red;  
  13.         }  
  14.     </style>  
  15.     <script type="text/javascript" src="jquery-1.6.2.min.js"></script>  
  16.     <script type="text/javascript">  
  17.         $(document).ready(function () {  
  18.             //给检验按钮注册事件  
  19.             $('#Regist').click(function () {  
  20.                 var userName = $('#UserName').val();  
  21.                 if ($.trim(userName) == "") { //用户输入不能为空或空格.  
  22.                     alert("用户名不能为空");  
  23.                 }  
  24.                 else {  
  25.                     //后台处理数据验证  
  26.                     $.get("jquery/UserRegist.aspx", { userName: userName }, function (data) {  
  27.                         $('#divMsg').html(data); //接受服务器处理返回数据，填充在div中  
  28.                     });  
  29.                 }  
  30.             });  
  31.             //注册文本框事件  
  32.             $('#UserName').keyup(function () {  
  33.                 var username = $(this).val();//获取当前文本框内容  
  34.                 if ($.trim(username) == "") {  
  35.                     $(this).addClass('UserText');//为空时添加红色边框  
  36.                 }  
  37.                 else {  
  38.                     $(this).removeClass('UserText');//不为空则移除  
  39.                 }  
  40.             });  
  41.         });  
  42.     </script>  
  43. </head>  
  44. <body>  
  45. 请输入用户名：<input type="text" id="UserName"/>  
  46. <input type="button" id="Regist" value="检验" />  
  47. <div id="divMsg"></div>  
  48. </body>  
  49. </html>  
poclist
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
ajax jquery验证用户名是否存在,jquery 验证用户名(ajax验证用户名是否存在）
weixin_42098830的博客
08-06 769
[导读] jquery 验证用户名(ajax验证用户名是否存在)下面我们要提供的是一款利用jquery插件来验证用户名哦，这里是利用jquery ajax来验证用户名是否存在哦。 jquery 验证用户名(ajax验证用户名是否存在)下面我们要提jquery 验证用户名(ajax验证用户名是否存在)下面我们要提供的是一款利用jquery插件来验证用户名哦，这里是利用jquery ajax来验证用户...
ajax注册验证 asp.net,Asp.net下利用Jquery Ajax实现用户注册检测（验证用户名是否存）...
weixin_33946174的博客
08-05 260
最近在朋友做个网站http://www.smarteas.net/，其中用实现用户注册这功能，最近网站做到了尾声，我也就把其它有些技术和大家分享一下。其中用到了jquery插件来验证用户名哦，这里是利用jquery ajax来验证用户名是否存在哦。大家看看效果图，后面将附上源码下载。jquery框架实现的ajax 验证用户名是否存在的部分JS复制代码 代码如下:$("#accounts").for...
Jquery+Servlet+JDBC实现登录注册功能
最新发布
敢问路在何方，路在脚下
05-15 941
引入JQuery包和JQuery.cookie包，前者封装了DOM操作的一些方法，后者封装了对cookie的操作我们使用cookie主要是为了做登录后页面的跳转时，能存下来这个用户是谁，这样后面可以对单一用户进行操作，比如根据用户id查询等。
JQuery+Ajax实现用户名的检测(用户名是否已存在)
sosohotsummer的专栏
07-23 2213
//JS中的代码：     $(document).ready(function(){     checkConfirm();          //验证用户名是否存在     function checkConfirm(){     $("#username").blur(function(){     var username = $(this).val();
JQuery+Ajax 使用JQuery完成异步用户名的校验
Kunaly
08-24 3243
案例：在注册页面中,当输入了用户名之后,光标离开文本框,显示用户名是否已经存在. 【Jquery的AJAX部分的概述】 由于传统AJAX开发代码比较麻烦,而且还有浏览器兼容的问题.传统的AJAX的使用在企业中是很少的.使用AJAX的一些框架完成.   JQuery的AJAX部分的API： * $(“”).load(url,data,function(){}); * $.get(ur
JQuery+AJAX实现用户名验证
03-16
NULL 博文链接：https://sxpujs.iteye.com/blog/408386
springmvc+jquery+ajax实现异步用户名验证
diu_brother的博客
09-08 7535
springmvc,jquery,ajax
jQuery+Ajax实现用户名重名实时检测
10-19
【jQuery+Ajax实现用户名重名实时检测】 在网页应用程序中，尤其是在用户注册的过程中，确保用户名的独特性是非常重要的。为了提高用户体验，实时检测用户名是否已被其他用户占用的功能变得越来越常见。本文将详细...
jquery ajax 检测用户注册时用户名是否存在
10-29
在本示例中，我们将探讨如何利用jQuery的AJAX技术来实时检测用户在注册时输入的用户名是否已存在于系统中，从而提供一个更流畅的用户体验。 首先，我们需要一个HTML页面（例如`grade.htm`），在这个页面中，用户...
Jquery+ajax+php+mysql数据库实现用户注册登录
04-06
在本项目中，"Jquery+ajax+php+mysql数据库实现用户注册登录"是一个典型的Web应用程序开发案例，它涵盖了前端交互、后端处理以及数据库管理等多个方面。以下将详细阐述这些知识点： 1. **Jquery**：Jquery是一个...
Asp.net下利用Jquery Ajax实现用户注册检测（验证用户名是否存）
01-21
jquery框架实现的ajax 验证用户名是否存在的部分JS 代码如下: $(“#accounts”).formValidator({onshow:”请输入用户名”,onfocus:”用户名至少4个字符,最多10个字符”,oncorrect:”该用户名可以注册”})....
登录界面的AJAX通过jquery判断用户名是否存在的实用小案例
weixin_44121079的博客
07-25 233
具体的jsp页面代码如下： <%@ page contentType="text/html;charset=UTF-8" language="java" %> <% session.invalidate(); %> <!DOCTYPE html> <html> <head lang="en"> <meta charset="...
Jquery、ajax、Spring、以及后台处理（-）
天蓝
03-30 2984
Spring下ajax,jquery,jquery datatable,以及前后台数据传值，json的理解
用户注册（检测用户名是否存在）
hljncxjh的专栏
07-27 1547
 private bool UserValild()    {        SqlConnection con = new SqlConnection(System.Configuration.ConfigurationSettings.AppSettings["sjk"]);        con.Open();        //查询用户输入的用户名是否存在        string sq
（5）-jQuery注册页面
x_____yx的博客
07-22 1169
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head&gt; &lt;me
jquery + json + springMVC集成在controller中实现Ajax功能
Alinaxz的专栏
07-21 3568
1、在spring配置文件中加入xmlViewResolverxml 代码        bean id="xmlViewResolver" class="org.springframework.web.servlet.view.XmlViewResolver">
spring+jquery+ajax 检测用户名是否存在
聪聪工作室的博客
12-10 4053
spring+jquery+ajax 检测用户名是否存在 话不多说，直接上代码 register.jsp<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefi
简单的jQuery检测注册用户名
weixin_34101784的博客
11-20 102
 test.html &lt;html&gt;&lt;head&gt;&lt;title&gt;表单验证&lt;/title&gt;&lt;mce:script src="jquery-1.3.2.min.js" mce_src="jquery-1.3.2.min.js" type="text/javascript"&gt;&lt;/mce:script&
ajax+jquery+json实现用户注册
06-03
好的，我可以为您提供一个简单的实现过程： 1. 编写HTML页面，包括输入框、按钮等元素，并引入jQuery和自己编写的JavaScript文件。 2. 在JavaScript文件中使用jQuery的`$.ajax()`方法发送注册请求，包括用户名、密码等信息，以及请求的url、请求方式、数据类型等参数。 3. 在服务器端，接收到注册请求后，解析请求参数，并将用户信息保存到数据库中。 4. 服务器端处理完请求后，返回响应数据，可以是一个简单的字符串，也可以是一个JSON对象，表示注册成功或失败等信息。 5. 在客户端JavaScript文件中，使用`$.ajax()`方法的回调函数，根据服务器返回的响应数据，更新显示信息，例如在页面上提示用户注册成功或失败的信息。 下面是一个简单的示例代码，以便您更好地理解： HTML页面： ``` <form> <label>用户名:</label> <input type="text" id="username" name="username"><br> <label>密码:</label> <input type="password" id="password" name="password"><br> <button type="button" id="registerBtn">注册</button> </form> ``` JavaScript文件： ``` $(function() { $('#registerBtn').click(function() { var username = $('#username').val(); var password = $('#password').val(); $.ajax({ type: 'POST', url: 'register.php', dataType: 'json', data: { username: username, password: password }, success: function(data) { if (data.success) { alert('注册成功!'); } else { alert('注册失败: ' + data.message); } }, error: function(xhr, status, error) { alert('注册失败: ' + error); } }); }); }); ``` PHP后端代码： ``` <?php // 解析请求参数 $username = $_POST['username']; $password = $_POST['password']; // 将用户信息保存到数据库中，此处省略 // 返回响应数据 $response = array('success' => true); echo json_encode($response); ?> ``` 以上代码仅作为示例，实际应用中还需要进行参数校验、异常处理等操作，以保证系统的健壮性和安全性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值