jQuery异步调用POST、GET方式深度解析

最新推荐文章于 2022-12-07 18:01:22 发布

jiji87432

最新推荐文章于 2022-12-07 18:01:22 发布

阅读量96

点赞数

分类专栏： jquery 文章标签： Jquery js post get

本文链接：https://blog.csdn.net/jiji87432/article/details/84382796

版权

jquery 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

1。定义一个模型person

package com.jiji.model;

public class Person

{

private int id;

private String name;

private int age;

private String address;

public int getId()

{

return id;

}

public void setId(int id)

{

this.id = id;

}

public String getName()

{

return name;

}

public void setName(String name)

{

this.name = name;

}

public int getAge()

{

return age;

}

public void setAge(int age)

{

this.age = age;

}

public String getAddress()

{

return address;

}

public void setAddress(String address)

{

this.address = address;

}

2.定义一个servlet。

package com.jiji.test;

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

import org.dom4j.Document;

import org.dom4j.DocumentHelper;

import org.dom4j.Element;

import org.dom4j.io.OutputFormat;

import org.dom4j.io.XMLWriter;

import com.jiji.model.Person;

public class XMLServlet extends HttpServlet {

@Override

protected void doPost(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {

String name = req.getParameter("name");

Person person = new Person();

if ("zhangsan".equals(name)) {

person.setId(1);

person.setName("zhangsan");

person.setAddress("beijing");

person.setAge(30);

} else {

person.setId(2);

person.setName("lisi");

person.setAddress("shanghai");

person.setAge(20);

}

//生成xml文件

Document document = DocumentHelper.createDocument();

Element rootElement = document.addElement("users");

rootElement.addComment("This is a comment!");

Element userElement = rootElement.addElement("user");

Element idElement = userElement.addElement("id");

Element nameElement = userElement.addElement("name");

Element ageElement = userElement.addElement("age");

Element addressElement = userElement.addElement("address");

idElement.setText(person.getId() + "");

nameElement.setText(person.getName());

ageElement.setText(person.getAge() + "");

addressElement.setText(person.getAddress());

resp.setContentType("text/xml; charset=utf-8");

resp.setHeader("pragma", "no-cache");

resp.setHeader("cache-control", "no-cache");

PrintWriter out = resp.getWriter();

//格式化文件

OutputFormat format = OutputFormat.createPrettyPrint();

format.setEncoding("utf-8");

XMLWriter xmlWriter = new XMLWriter(out, format);

xmlWriter.write(document);

out.flush();

}

@Override

protected void doGet(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {

this.doPost(req, resp);

}

3.定义一个jsp文件显示。

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>My JSP 'xml.jsp' starting page</title>

<!--

-->

$(function()

{

$("#button1").click(function()

{

$.ajax({

type: "POST",

url: "XMLServlet",

dateType: "xml",

data: {name: $("#name").val()},

success: function(returnedData){

alert(returnedData);

var id = $(returnedData).find("id").text();

var name = $(returnedData).find("name").text();

var age = $(returnedData).find("age").text();

var address = $(returnedData).find("address").text();

var html = "<table width='60%' border='1' align='center'><tr><th>id</th><th>name</th><th>age</th><th>address</th><tr align='center'><td>" + id + "</td><td>" + name + "</td><td>" + age + "</td><td>" + address + "</td></tr></table>";

$("#theBody table:eq(0)").remove();

$("#theBody").append(html);

}

});

$("#button1").click(function()

{

$.get("XMLServlet",

{

name: $("#name").val()

}, function(returnedData, status)

{

var id = $(returnedData).find("id").text();

var name = $(returnedData).find("name").text();

var age = $(returnedData).find("age").text();

var address = $(returnedData).find("address").text();

$("#theBody table:eq(0)").remove();

$("#theBody").append(html);

});

});*/

});

</script>

</head>

<option value="zhangsan">zhangsan</option>

</select>

</body>

</html>

4.最后预览结果。

jiji87432

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery异步调用POST、GET方式深度解析

1。定义一个模型personpackage com.jiji.model; public class Person{private int id; private String name; private int age; private String address; public int getId(){return id;}...
复制链接

扫一扫

专栏目录