Maison >interface Web >js tutoriel >Exemple d'implémentation d'Ajax pour vérifier si le nom d'utilisateur est disponible sur la base de jQuery
Cet article présente principalement en détail l'exemple d'implémentation d'Ajax basé sur jQuery pour vérifier si le nom d'utilisateur est disponible. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer
L'exemple de cet article est. partagé avec tout le monde. cas simple jQuery ajax - code spécifique pour vérifier si le nom d'utilisateur est disponible, pour votre référence, le contenu spécifique est le suivant
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,{'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>
Servlet de connexion
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='red'>用户名被占用</font>"); } else { // 用户名可以使用 response.getWriter().write("<font color='green'>用户名可以使用</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>
Ce qui précède est ce que j'ai compilé pour vous. J'espère qu'il vous sera utile à l'avenir.
Articles connexes :
Un tutoriel simple sur l'utilisation de less dans vue2
fichier de configuration d'échafaudage vue-cli sous bulid
Exemple de code Vue pour développer un composant de bouton
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!