版权声明：本文为大都督作者的原创文章，未经 大都督 允许也可以转载，但请注明出处，谢谢！ 共勉！ https://blog.csdn.net/qq_37335220/article/details/85854194
1.效果图
1.1 点击姓名后
1.2 点击性别后
2.HTML代码
2.1 jquery_ajaxSetup.html页面代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>63 jQuery-使用ajaxSetup（）方法全局设置Ajax</title>
<style type="text/css">
body{font-size:13px}
.divFrame{width:260px;border:solid 1px #666}
.divFrame .divTitle{padding:5px;background-color:#eee;}
.divFrame .divContent{padding:8px}
.divFrame .divContent .clsShow{font-size:14px}
.btn {border:#666 1px solid;padding:2px;width:80px;
filter: progid:DXImageTransform.Microsoft
.Gradient(GradientType=0,StartColorStr=#ffffff,
EndColorStr=#ECE9D8);}
</style>
</head>
<body>
<div class="divFrame">
<div class="divTitle">
<span>
<input id="Button1" type="button" value="姓名" class="btn" />
</span>
<span>
<input id="Button2" type="button" value="性别" class="btn" />
</span>
<span>
<input id="Button3" type="button" value="爱好" class="btn" />
</span>
</div>
<div class="divContent">
<div id="divTip" class="clsShow"></div>
</div>
</div>
<script src="../../js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//设置全局性的Ajax选项
$.ajaxSetup({
type: "GET",
url: "/jquery/user_xml",
dataType: "xml"
})
//姓名按钮的单击事件
$("#Button1").click(function(){
$.ajax({
success: function(data) {//传回请求响应的数据
//显示姓名部分
showData(data, "姓名", "name");
}
})
})
//性别按钮的单击事件
$("#Button2").click(function(){
$.ajax({
success: function(data) {//传回请求响应的数据
//显示姓名部分
showData(data, "性别", "sex");
}
})
})
//爱好按钮的单击事件
$("#Button3").click(function(){
$.ajax({
success: function(data) {//传回请求响应的数据
//显示姓名部分
showData(data, "爱好", "hobby");
}
})
})
})
function showData(d, n, v) {
//先清空标记中的内容
$("#divTip").empty();
//初始化保存内容变量
var strHTML = "";
//遍历获取的数据
$(d).find("User").each(function(){
var $strUser = $(this);
strHTML += n+":"+$strUser.find(v).text()+"<hr>";
})
//显示处理后的数据
$("#divTip").html(strHTML);
}
</script>
</body>
</html>
2.2 user.xml页面代码
<Info>
<User id="1">
<name>大都督</name>
<sex>男</sex>
<hobby>学习</hobby>
</User>
<User id="2">
<name>大都督1</name>
<sex>女</sex>
<hobby>敲代码</hobby>
</User>
</Info>
Java代码
package com.example.demo.manager;
import java.util.Map;
import org.apache.commons.lang3.StringUtils;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
/**
* @Description jquery控制层
* @author 大都督
* @date 2019年1月3日
*/
@Controller
@RequestMapping("/jquery")
public class JqueryManager extends BaseManager{
/**
*
* @Title: userXML
* @Description: 获取user.xml页面
* @return
* @author 大都督
* @date 2019年1月5日
* @return String
*/
@RequestMapping("/user_xml")
public String userXML() {
return "jquery/testFile/user.xml";
}
/**
*
* @Title: jqueryAjaxSetup
* @Description:跳转到jquery_ajaxSetup页面
* @return
* @author 大都督
* @date 2019年1月5日
* @return String
*/
@RequestMapping("/jquery_ajaxSetup")
public String jqueryAjaxSetup() {
return "jquery/ajax/jquery_ajaxSetup";
}
}