Maison > Article > interface Web > jQuery+Ajax authentifier l'utilisateur

jQuery+Ajax authentifier l'utilisateur

php中世界最好的语言original: 2018-06-14 09:46:351121parcourir

Cette fois, je vais vous présenter la vérification des utilisateurs jQuery+Ajax. Quelles sont les précautions à prendre pour la vérification des utilisateurs jQuery+Ajax ? Ce qui suit est un cas pratique, jetons un coup d'œil.

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/jquery_ajax/js/jquery-1.8.3.js"></script>
<script type="text/javascript">
 //页面加载完成后
 $(function() {
  //添加失焦事件
  $("#username").blur(function() {
   //获取录入的用户名
   var usernamevalue = $("#username").val();
   //向服务器发送请求
   var url="/jquery_ajax/load";
   $("#username_span").load(url,{'username':usernamevalue});
  });
 });
</script>
</head>
<body>
 <input type="text" name="username" id="username"><span id="username_span"></span>
 <br>
 <input type="password" name="password">
 <br>
</body>
</html>

LoginServlet

public class LoadServlet extends HttpServlet {
 public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  // 解决乱码
  request.setCharacterEncoding("utf-8");
  response.setCharacterEncoding("utf-8");
  // 1.得到用户名
  String username = request.getParameter("username");
  // 2.判断用户名是否可以使用
  if ("tom".equals(username)) {
   // 用户名不可以使用
   response.getWriter().write("<font color=&#39;red&#39;>用户名被占用</font>");
  } else {
   // 用户名可以使用
   response.getWriter().write("<font color=&#39;green&#39;>用户名可以使用</font>");
  }
 }
 public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
  doGet(request, response);
 }
}

web.xml

<servlet>
 <description></description>
 <display-name>LoadServlet</display-name>
 <servlet-name>LoadServlet</servlet-name>
 <!-- 
  Class clazz = Class.forName("com.zxl.servlet.LoadServlet");
  Object obj = clazz.newInstatnce();
  // 反射去调用 doGet, doPost
  -->
 <servlet-class>com.zxl.servlet.LoadServlet</servlet-class>
 </servlet>
 <servlet-mapping>
 <servlet-name>LoadServlet</servlet-name>
 <url-pattern>/load</url-pattern>
 </servlet-mapping>

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article Pour des informations plus intéressantes. , veuillez faire attention au site Web chinois php Autres articles connexes !

Lecture recommandée :

Comment utiliser le développement mixte Android et HTML

Comment utiliser le nouvel affichage des attributs CSS : coffret

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

php jquery css ajax html xml display android

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Problèmes liés à l'optimisation du chargement des fichiers dans jsArticle suivant：Problèmes liés à l'optimisation du chargement des fichiers dans js

Articles Liés

Voir plus