servlet+JQuery ajax以json的形式的验证表单小实例
生活随笔
收集整理的這篇文章主要介紹了
servlet+JQuery ajax以json的形式的验证表单小实例
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
JQuery $.ajax()
$.ajax({type: 'POST', //請求方式 一般是get，posturl: url , // 這是必需的，規(guī)定把請求發(fā)送到哪個 URLdata: data , //這個是可選。映射或字符串值。規(guī)定連同請求發(fā)送到服務(wù)器的數(shù)據(jù)。java中用request.getParameter(key)來接收success: success , //可選。請求成功時執(zhí)行的回調(diào)函數(shù)。 success：function(){}dataType: dataType //可選。規(guī)定預(yù)期的服務(wù)器響應(yīng)的數(shù)據(jù)類型。默認(rèn)執(zhí)行智能判斷（xml、json、script 或 html）});案例
一個簡單的表單驗證的案例
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <html><head><title>$Title$</title></head><script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js" type="text/javascript"></script><style>#contair{margin-top: 20vh;display: flex;flex-direction: row;justify-content:center ;}</style><body><div id="contair"><div>用戶名：<input type="text" id="username"></div><div>密碼：<input type="password" id="password"></div><button id="button" onclick="myfunction()">提交</button></div></body> <script type="text/javascript" >function myfunction() {$.ajax({url:"http://localhost:8080/ajax_servlet_test_war_exploded/servlet1",dataType:"json",type:"post",data:{"username":$("#username").val(),"password":$("#password").val()},success:function (data) {var flag=data.flag;if(flag=="true"){alert(" 登陸成功！");}else{alert("賬號或密碼錯誤");}}});} </script> </html>對應(yīng)的servlet
package com.servlet.test;import net.sf.json.JSONArray; import net.sf.json.JSONException; import net.sf.json.JSONObject;import javax.servlet.*; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.io.PrintWriter; import java.util.ArrayList; import java.util.List;public class ServletTest extends HttpServlet {@Overrideprotected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {response.setContentType("application/json;charset=utf-8");request.setCharacterEncoding("utf-8"); // JSONArray jsonArray=new JSONArray();// jsonArray.add(0,jsonObject1);String username=request.getParameter("username");String password=request.getParameter("password");PrintWriter out=response.getWriter();System.out.println(username+"\n"+password);JSONObject jsonObject=null;if("xiuyuandashen".equals(username) && "123456".equals(password)){jsonObject =new JSONObject();jsonObject.put("flag","true");}else{jsonObject=new JSONObject();jsonObject.put("flag","false");}out.print(jsonObject);out.close(); //必須要關(guān)閉他，我也忘記為啥了 好像是不關(guān)閉不會傳輸？}@Overrideprotected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {doPost(req,resp);} }效果
總結(jié)
以上是生活随笔為你收集整理的servlet+JQuery ajax以json的形式的验证表单小实例的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 关于lock_guard使用细节
- 下一篇： Kubernetes 持久化存储 Cep