Heim > Artikel > Web-Frontend > Beispiel für die Implementierung von Ajax, um basierend auf jQuery zu überprüfen, ob der Benutzername verfügbar ist

Beispiel für die Implementierung von Ajax, um basierend auf jQuery zu überprüfen, ob der Benutzername verfügbar ist

亚连Original: 2018-05-29 09:46:251528Durchsuche

In diesem Artikel wird hauptsächlich das Beispiel der Implementierung von Ajax basierend auf jQuery vorgestellt, um zu überprüfen, ob der Benutzername einen bestimmten Referenzwert hat.

Das Beispiel dieses Artikels ist Mit allen geteilt. jQuery Ajax einfacher Fall – spezifischer Code, um zu überprüfen, ob der Benutzername verfügbar ist. Als Referenz lautet der spezifische Inhalt wie folgt:

HTML

<!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,{&#39;username&#39;: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>

Das Obige habe ich für alle zusammengestellt und hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

Ein einfaches Tutorial zur Verwendung von less in vue2

vue-cli scaffolding-configuration file unter bulid

Vue-Beispielcode für die Entwicklung einer Schaltflächenkomponente

Das obige ist der detaillierte Inhalt vonBeispiel für die Implementierung von Ajax, um basierend auf jQuery zu überprüfen, ob der Benutzername verfügbar ist. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Problem beim Hinzufügen von Ausdrücken zu v-show in Vue (bestimmen, ob angezeigt werden soll)Nächster Artikel：Problem beim Hinzufügen von Ausdrücken zu v-show in Vue (bestimmen, ob angezeigt werden soll)

In Verbindung stehende Artikel

Mehr sehen