jQuery+json實作的簡易Ajax呼叫實例_jquery
本文實例講述了jQuery+json實作的簡易Ajax呼叫。分享給大家參考，具體如下：
Userservlet.java程式碼：
package com.iss.servlet;
import org.json.JSONException;
import org.json.JSONObject;
import com.iss.pojo.User;
import com.iss.util.JSONUtil;
public class UserServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
//list 添加对象
List<User> userList = new ArrayList<User>();
User user1 = new User("张三", "男", "18");
User user2 = new User("李四", "男", "19");
User user3 = new User("王五", "男", "20");
userList.add(user1);
userList.add(user2);
userList.add(user3);
PrintWriter out = response.getWriter();
String str = null;
try {
//帐号密码如果匹配则把list 返回给界面
if (request.getParameter("userName").equals("jquery")
&& request.getParameter("password").equals("ajax")) {
str = JSONObject.quote(JSONUtil.toJSONString(userList));
}
out.print(str);
} catch (JSONException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
System.out.println("str "+str);
out.flush();
out.close();
}
}
Html代碼：
<body>
帐号 jquery 密码 ajax
<form id="mainform">
<ul>
<li>
帐号
<input type="text" name="userName" />
</li>
<li>
密码
<input type="password" name="password" />
</li>
<li>
<input onclick="login()" type="button" value="登录" />
</li>
</ul>
</form>
查询到的数据
<div id="diva">
</div>
<script type="text/javascript">
function login(){
//获取form的参数
var args =$("#mainform").serialize();
//调用 jquery 的json获取方法
//三个参数分别为 ：请求路径 ，请求参数，返回数据的回调函数
$.getJSON("servlet/UserServlet",args,function (data){
if(data!=null){
// 界面返回的是一个json格式字符串 调用JSON.parse()把数据转化为json
// 格式的对象
var jsondata =JSON.parse(data);
parseData(jsondata);
}else{
alert("帐号密码输入有误");
}
})
}
function parseData(data){
var str="";
//遍历json格式数据
for (var key in data){
strstr =str+" 用户"+data[key].userName+" 年龄"+data[key].age+"<br/>"
alert(str);
}
//把数据添加到div中
$("#diva").html(str);
}
</script>
</body>
UserServlet 記得要匯入 工具類別 JSONStringObject JSONUtil
jsp 要導入 jquery.js和 json.js
希望本文所述對大家jQuery程式設計有所幫助。
熱AI工具
Undresser.AI Undress
人工智慧驅動的應用程序，用於創建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Undress AI Tool
免費脫衣圖片
Clothoff.io
AI脫衣器
AI Hentai Generator
免費產生 AI 無盡。
熱門文章
熱工具
記事本++7.3.1
好用且免費的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強大的PHP整合開發環境
Dreamweaver CS6
視覺化網頁開發工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
熱門話題
PHP 數組轉 JSON 的效能最佳化技巧
May 04, 2024 pm 06:15 PM
PHP數組轉JSON的效能最佳化方法包括：使用JSON擴充和json_encode()函數；新增JSON_UNESCAPED_UNICODE選項以避免字元轉義；使用緩衝區提高循環編碼效能；快取JSON編碼結果；考慮使用第三方JSON編碼庫。
Jackson庫中註解如何控制JSON序列化和反序列化？
May 06, 2024 pm 10:09 PM
Jackson庫中的註解可控制JSON序列化和反序列化：序列化：@JsonIgnore：忽略屬性@JsonProperty：指定名稱@JsonGetter：使用獲取方法@JsonSetter：使用設定方法反序列化：@JsonIgnoreProperties：忽略屬性@ JsonProperty：指定名稱@JsonCreator：使用建構子@JsonDeserialize：自訂邏輯
深入了解PHP：JSON Unicode轉中文的實作方法
Mar 05, 2024 pm 02:48 PM
深入了解PHP：JSONUnicode轉中文的實作方法在開發中，我們經常會遇到需要處理JSON資料的情況，而JSON中的Unicode編碼在一些場景下會為我們帶來一些問題，特別是當需要將Unicode編碼轉換為中文字元時。在PHP中，有一些方法可以幫助我們實現這個轉換過程，以下將介紹常用的方法，並提供具體的程式碼範例。首先，讓我們先來了解一下JSON中Un
PHP 數組轉 JSON 的快捷技巧
May 03, 2024 pm 06:33 PM
PHP陣列可透過json_encode()函數轉換為JSON字串（例如：$json=json_encode($array);），反之亦可用json_decode()函數從JSON轉換為陣列（$array=json_decode($json);） 。其他技巧還包括：避免深度轉換、指定自訂選項以及使用第三方程式庫。
如何判斷jQuery元素是否具有特定屬性？
Feb 29, 2024 am 09:03 AM
如何判斷jQuery元素是否具有特定屬性？在使用jQuery操作DOM元素時，常會遇到需要判斷元素是否具有某個特定屬性的情況。在這種情況下，我們可以藉助jQuery提供的方法來輕鬆實現這項功能。以下將介紹兩種常用的方法來判斷一個jQuery元素是否具有特定屬性，並附上具體的程式碼範例。方法一：使用attr()方法和typeof運算子//判斷元素是否具有特定屬
PHP教學：如何將JSON Unicode轉換為中文字符
Mar 05, 2024 pm 06:36 PM
JSON（JavaScriptObjectNotation）是一種輕量級的資料交換格式，通常用於Web應用程式之間的資料交換。在處理JSON資料時，我們經常會遇到Unicode編碼的中文字元（例如"u4e2du6587"），需要將其轉換為可讀的中文字元。在PHP中，我們可以透過一些簡單的方法來實現這個轉換。接下來，我們將詳細介紹如何將JSONUnico
如何使用 PHP 函數處理 JSON 資料？
May 04, 2024 pm 03:21 PM
PHP提供了以下函數來處理JSON資料：解析JSON資料：使用json_decode()將JSON字串轉換為PHP數組。建立JSON資料：使用json_encode()將PHP陣列或物件轉換為JSON字串。取得JSON資料的特定值：使用PHP數組函數存取特定值，例如鍵值對或陣列元素。
使用jQuery為表格新增一行的方法介紹
Feb 29, 2024 am 08:12 AM
jQuery是一個受歡迎的JavaScript函式庫，廣泛用於網頁開發。在網頁開發過程中，經常需要透過JavaScript動態地在表格中新增一行。本文將介紹如何使用jQuery為表格新增一行，並提供具體的程式碼範例。首先，我們需要在HTML頁面中引入jQuery函式庫。可以透過以下程式碼在標籤中引入jQuery庫：
