jQuery_review之使用$.getScript()以及$.getJSON來與服務端進行非同步資訊互動，jquerygetscript
jQuery還提供了兩個非常實用的方法，分別是$.getScript()以及$.getJSON()。這個兩個方法非常之重要，假設我們現在要編寫一個架構，如果能在後台控制前台表格的動作，我們應該怎麼做？肯定是要在後台向前台發送一個JavaScript，從而讓前台的JavaScript執行，當然有很多方法，比如建立一個Script的節點放在DOM樹中，或者是在HTML中增加一個<script>節點，都是解決這個問題的方法。但是getScript也不失是解決這個問題的一個很好地方案。
此外，現在JSON由於書寫簡便，傳輸資料比較小，資料冗餘度好，而慢慢的大有取代XML的形式。Google也提供了很多第三方的可靠的json轉換的解決方案。所以json的威力還是不能小瞧的。
使用jQuery的這兩個方案，有幾個要注意的點：這兩個方法$.getScript()以及$.getJSON()都有兩個參數，第一個參數是提供給jQuery向什麼地址尋求資源，第二個就是資源返回之後，會提供什麼樣子的函數來調用上面的資源，第一個回呼函數是用來執行上面的JavaScript方法中的函數，第二個回呼函數則是用來解析剛剛擷取的JSON的字串。此外，JSON的格式是這樣的{"name1":"value1","name2":"value2"}，請注意裡面的不是單引號，而是雙引號，如果寫成引號，可能會導致jquery無法解析上面的JSON字串。最後，如何解析JSON？data['name1']以及使用$.each(data,function(idx,item){})來進行解析，要根據JSON的格式不同選擇正確的解析方式。
前端的DEMO代碼如下：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <script type="text/javascript" src="jquery-1.8.3.js"></script><script type="text/javascript">$(function(){$("#getContent").click(function(){$.getScript("czz.js",function(){alertHtml($("#showText"));})});$("#getJson").click(function(){$.getJSON("test?name=czz&address=dszy",function(data){var str = data['name']+" "+data['address'];$("#showText").empty().text(str);});});}); </script> </head> <body> <div id="showText"><span>He who hesitates is lost.</span></div> <input type="button" id="getContent" value="getAjax"> <input type="button" id="getJson" value="getJson"> </body></html>
@Overrideprotected void doPost(HttpServletRequest req, HttpServletResponse resp)throws ServletException, IOException {String name = req.getParameter("name");String address = req.getParameter("address");StringBuffer sb = new StringBuffer("");sb.append("{\"name\":\"") .append(name) .append("_czz\",\"address\":\"") .append(address) .append("_czz\"}");resp.setContentType("html/JSON;charset=utf-8");resp.getWriter().print(sb.toString());}
function alertHtml(e){alert(e.html());}
緩衝的問題吧，'getdate.do?id=100'後面再傳個每次不一樣的東西就好了，像這樣：
'getdate.do?id=100&t='+Math.random()
用的是隨機數，也可以用new Date()時間戳記來實現
為何指令碼會先被執行$getJSON外的程式,而不是$getJSON內的?解!
function Msg(){
$.getJSON(url,function(data){ //最先執行到這
alert("來過!");//getJSON取完後調用回呼函數
});
alert("飄過!");//直接alert
}
過程是這樣的。當取json的URL的時候需要一個過程。但飄過不會去等這個JSON。所以先彈出來了。當取完JSON後。觸發回呼函數。這是“來過”就彈出來了。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
