在網頁上常常會看到,點擊某些東西之後就會即時的顯示一些資料
例如旅行社網頁,選擇價錢可以即時出現該價位的飯店
其實是透過AJAX(Asynchronous JavaScript and XML)處理的
jQuery Ajax
HTML:
jQuery:
4 | url : "fetch_data.php?act=" +n, |
6 | success : function ($msg){ |
fetch_data:
jQuery會將fetch_data echo出來的東西全部塞到#con這個區塊內,不過#con裡原先若有其他內容將會被覆蓋過去
且原先就寫在網頁中的javascript判斷不到利用AJAX顯示出來的DOM元件
若要使用則需將javascript放在fetch_data一同輸出。
sync ajax
3 | url : "fetch_data.php?act=" +n, |
7 | success : function ($msg){ |
jQuery在AJAX部份也越來越多新用法,比如說:
2 | $.post( "test.php" , { "name" : "姓名" , "bir" : "19891028" }, |
AJAX觸發事件流程
1 | ajaxStart > ajaxSend > ajaxSuccess 或 ajaxError > ajaxComplete > ajaxStop |
所以可以針對以上觸發事件做一些loading的特效
1 | $(document).ajaxStart( function (){ |
4 | $(document).ajaxComplete( function (){ |
AJAX因為安全性問題所以無法跨網域抓資料,如果有需求的需要再另外處理