Ajax结合json在web中的应用
1.web前端頁面
<!DOCTYPE html>
<html><head>
? ? <meta ?http-equiv="Content-Type" content="text/html; charset=utf-8"/>
? ? <script src="jquery/jquery-2.2.1.min.js"></script>
? ? <script type="text/javascript" src="json/json2.js"></script> ?
<title>測試Ajax</title>
<script type="text/javascript">
? ? ? ?$(document).ready(
? ? ? ? ? function(){
? ? ? ? $('#bt1').click(function(){
? ? ? ? ? ? ?$.ajax({
? ? ? ? ? ? ?dataType:"json",
? ? ? ? ? ? ?type: "GET",
? ? ? ? ? ? ?url: "AjaxAction",
? ? ? ? ? ? ?data: "username=kaxifa&&password=123456",
? ? ? ? ? ? ?success: function(data){
? ? ? ? ? ? ?
? ? ? ? ? ? ?var jsonArr=eval(data); ? ? //比較重要的函數(shù)，用來解析服務(wù)器傳來的對(duì)象
? ? ? ? ? ? ?var dataArray="";
? ? ? ? ? ? ? for(var i=0;i<jsonArr.length-1;i++){
? ? ? ? ? ? ? ?dataArray+=jsonArr[i].username+",";
? ? ? ? ? ? ? ?dataArray+=jsonArr[i].password+",";
? ? ? ? ? ? ? ?dataArray+=jsonArr[i].date;
? ? ? ? ? ? ? }
? ? ? ? ? ?
? ? ? ? ? ? ? ? ? ? ? ? ?$('#resText').html(dataArray);
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? }
? ? ? ? ? ? ? ? ? ? });
? ? ? ? ?
? ? ? ? });
? ? });
</script>
</head>
<body>
? ? ?
? ? ?<button id="bt1">發(fā)送</button>
? ? ?<p id="resText">
? ? ? ? ? 從前從前，我很愛你！2016
? ? ?</p>
</body>
</html>
1.服務(wù)器端：
package test10;
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Date;
import java.text.ParseException;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Calendar;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import net.sf.json.JSONArray;
public class AjaxAction extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
User user = new User();
user.setUsername("小強(qiáng)");
user.setPassword("66666");
Long time=System.currentTimeMillis();
String d=new SimpleDateFormat("yyyy-MM-dd hh:mm:ss").format(new Date(time));
user.setDate(d);
List list = new ArrayList();
//不指定泛型的話，可以攜帶多種數(shù)據(jù)類型
list.add(user);
list.add("1025");
String username=request.getParameter("username");
String password=request.getParameter("password");
System.out.println("username="+username);
System.out.println("password="+password);
JSONArray array=JSONArray.fromObject(list);
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
? ? ? ? ? ? ? ?out.write(array.toString());//把對(duì)象寫回給瀏覽器
out.flush();
out.close();
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
? ? ? ? ?doGet(request, response);
}
}
總結(jié)
以上是生活随笔為你收集整理的Ajax结合json在web中的应用的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Cookie和Session的区别详解
- 下一篇： hibernate处理懒加载异常的方法