版权声明:本文为大都督作者的原创文章,未经 大都督 允许也可以转载,但请注明出处,谢谢! 共勉! https://blog.csdn.net/qq_37335220/article/details/85803354
1.效果图
2.HTML代码
2.1 jquery_getScript.html页面代码
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>60 jQuery-全局函数getScript()</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">
<input id="Button1" type="button" class="btn" value="获取数据" />
</div>
<div class="divContent">
<div id="divTip"></div>
</div>
</div>
<script src="../../js/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//按钮点击事件
$("#Button1").click(function(){
//打开已获取返回数据的文件
$.getScript("/jquery/userInfo_js");
})
})
</script>
</body>
</html>
2.2 userInfo.js代码
var data = [
{
"name": "大都督",
"hobby": "敲代码"
},
{
"name": "大都督1",
"hobby": "敲代码1"
}
];
//初始化保存内容变量
var strHTML = "";
//遍历获取的数据
$.each(data, function(InfoIndex, Info){
strHTML += "姓名:"+Info["name"]+"<br>";
strHTML += "爱好:"+Info["hobby"]+"<br>";
})
//显示处理后的数据
$("#divTip").html(strHTML);
3.Java代码
package com.example.demo.manager;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
/**
* @Description jquery控制层
* @author 大都督
* @date 2019年1月3日
*/
@Controller
@RequestMapping("/jquery")
public class JqueryManager extends BaseManager{
/**
*
* @Title: jqueryGetScript
* @Description:跳转到jquery_getScript页面
* @return
* @author 大都督
* @date 2019年1月4日
* @return String
*/
@RequestMapping("/jquery_getScript")
public String jqueryGetScript() {
return "jquery/ajax/jquery_getScript";
}
/**
*
* @Title: userInfo_js
* @Description:跳转到奥userInfo.js页面
* @return
* @author 大都督
* @date 2019年1月4日
* @return String
*/
@RequestMapping("/userInfo_js")
public String userInfo_js() {
return "jquery/testFile/userInfo.js";
}
}