jquery 获取json文件数据，显示到jsp页面上， 或者html页面上

时间：2021-06-26 19:38:24

[{"name":"中国工商银行","code":102},{"name":"中国农业银行","code":103},{"name":"中国银行","code":104},{"name":"平安银行","code":307}]   // code.json  文件


<script type="text/javascript">

		$(function(){

		$("#btn").click(function(){

		$.getJSON("area/code.json",function(data){

		var $jsontip = $("#jsonTip");

		var $json = $("#json");

		var strHtml = "";//存储数据的变量

		var json = "";//存储数据的变量

		$jsontip.empty();//清空内容

		$json.empty();//清空内容

		$.each(data,function(infoIndex,info){

		strHtml += ""+info["name"]+"<br>";

		json += ""+info["code"]+"<br>";

		strHtml += "<hr>"

		})

		$jsontip.html(strHtml);//显示处理后的数据

		$json.html(json);//显示处理后的数据

		})

		})

		})

	</script>

</head>

<body>

	<div>

		<input type="button" value="获取数据" id="btn" />

	</div>

	<div id="jsonTip"></div>

	<div id="json"></div>

</body>

</html>

　　

相关文章