Ajax java struts 实现用户名验证

3 篇文章 0 订阅
1 篇文章 0 订阅

//用户名验证的struts

package com.mobi5.web.struts.action;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.struts.action.ActionForm;
import org.apache.struts.action.ActionForward;
import org.apache.struts.action.ActionMapping;

import com.mobi5.commons.domain.Sys_MobileUser_Reginfo;

public class ValidUsernameAction extends BaseAction {
 public ActionForward execute(ActionMapping mapping, ActionForm form,
   HttpServletRequest request, HttpServletResponse response)
   throws Exception {
  String username = request.getParameter("user_name");
  username = new String(username.trim().getBytes("ISO8859_1"), "gbk");
  Sys_MobileUser_Reginfo user = new Sys_MobileUser_Reginfo();
  user.setUser_name(username);
  //user = this.getIdService().getUserByUsername(username);
  user=this.getIdService().getUserInfoBy(user);
  String message = "";
  if (user != null) {
   message = "1";
   response.setContentType("text/xml; charset=gbk");
   response.getWriter().write(message);
   response.getWriter().close();
  } else {
   message = "0";
   response.setContentType("text/xml; charset=gbk");
   response.getWriter().write(message);
   response.getWriter().close();
  }
  return null;
 }
}

//jsp 页面

 

//验证用户名是否存在
 var xmlHttp;
 function createXMLHttpRequest(){
  if(window.XMLHttpRequest)
  {
   xmlHttp = new XMLHttpRequest();
  }else if(window.ActiveXObject)
  {
   xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }
 
 }
 
 function valid(){
    
  if(form2.user_name.value=="" || trim(form2.user_name.value).length ==0){
   alert("用户名不能为空!")
   return false;
  }
  var message = document.getElementById("message1");
  
  message.innerHTML="";
  createXMLHttpRequest();
  
  window.status ='';
  url ="validUsernameAction.do?user_name="+document.form2.user_name.value;
  xmlHttp.open("GET",url,true);
  xmlHttp.onreadystatechange = validUsername;
  xmlHttp.send(null);
 
 }
 
 function validUsername(){
  
  if (xmlHttp.readyState == 4)
  {
   if (xmlHttp.status == 200 || xmlHttp.status == 0)
   {
    resText = xmlHttp.responseText;
    if(resText=="1"){
     var message = document.getElementById("message1");
     message.innerHTML="<span style='color:red'>&nbsp;&nbsp;<b>用户名已经存在,请选用其它用户名!</b></span>";
     form2.user_name.value="";
     form2.user_name.focus();
    }else {
     var message = document.getElementById("message1");
     message.innerHTML="<span style='color:red'>&nbsp;&nbsp;<b>用户名可以使用!</b></span>";
    }
   }
  }
 }

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1. 在前端页面中,通过监听输入框的键盘抬起事件,获取输入的用户名。 2. 发送一个ajax请求到后端,传递用户名参数。 3. 后端接收到请求后,查询数据库中是否存在该用户名。 4. 如果存在该用户名,则返回错误信息给前端。如果不存在,则返回成功信息。 5. 前端页面根据返回的信息,显示相应的提示,例如红色字体提示“用户名已存在”或绿色字体提示“用户名可用”。 以下是大致的示例代码: 前端页面: ``` <input type="text" id="username" onkeyup="checkUsername()" /> <div id="username_tip"></div> <script> function checkUsername() { var username = document.getElementById("username").value; var xhr = new XMLHttpRequest(); xhr.open('POST', 'check_username.php', true); xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); xhr.onreadystatechange = function() { if (xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { var response = JSON.parse(xhr.responseText); if (response.result === 'fail') { document.getElementById("username_tip").innerHTML = "<span style='color: red;'>用户名已存在</span>"; } else { document.getElementById("username_tip").innerHTML = "<span style='color: green;'>用户名可用</span>"; } } } }; xhr.send('username=' + encodeURIComponent(username)); } </script> ``` 后端代码(使用PHP语言): ``` <?php $db_host = 'localhost'; $db_name = 'test'; $db_user = 'root'; $db_pass = ''; $username = $_POST['username']; try { $dsn = "mysql:host=$db_host;dbname=$db_name;charset=utf8mb4"; $pdo = new PDO($dsn, $db_user, $db_pass); $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION); $stmt = $pdo->prepare("SELECT COUNT(*) FROM users WHERE username = ?"); $stmt->execute([$username]); $count = $stmt->fetchColumn(); if ($count > 0) { echo json_encode(array("result" => "fail")); } else { echo json_encode(array("result" => "success")); } } catch(PDOException $e) { echo json_encode(array("result" => "error", "message" => $e->getMessage())); } ?> ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值