jquery ajax 應用執行個體代碼
/*
ajax 向頁面發送資料
$.post('save.cgi', {
text: 'my string',
number: 23
}, function() {
alert('your data has been saved.');
});
如果您確實需要編寫一些複雜的 ajax 指令碼,那麼需要用到 $.ajax() 函數。您可以指定 xml、script、html 或者 json,jquery 將自動為回呼函數準備合適的結果,這樣您便可以立即使用該結果。還可以指定 beforesend、error、success 或者 complete 回呼函數,向使用者提供更多有關 ajax 體驗的反饋。此外,還有一些其它的參數可供使用,您可以使用它們設定 ajax 請求的逾時,也可以設定頁面 "最近一次修改" 的狀態
*/
//超簡單jquery ajax應用
function visit_build(){
var myclasses = new ajax('visit!build.action', {
method: 'post',
data:{
id:this_bid
},
oncomplete: function(response){
}
}).request();
}
//下面來個驗證郵箱地址郵箱驗證執行個體帶多個參數的
function nactactivity_submit(){
var aid = $('aid').value;
var name = $('a_name').value;
var mobile = $('mobile').value;
var email = $('email').value;
var address = $('address').value;
var email_p = /^([a-za-z0-9_-])+@([a-za-z0-9_-])+(.[a-za-z0-9_-])+/;
var tel_p = /^[0-9-]+$/;
if(name.length>0 && mobile.length==11 && email.length>0 && email_p.test(email) && tel_p.test(mobile)){
var myclasses = new ajax('activity!submitnact.action', {
method: 'post',
data:{
id:aid,
name:name,
mobile:mobile,
email:email,
address:address
},
oncomplete: function(response){
$('massage_box').sethtml(response);
$('massage_box').setstyle('width', 810);
$('massage_box').setstyle('height', 500);
$('massage_box').setstyle('visibility', 'visible');
$('mask').setstyle('visibility', 'visible');
$('massage_box').setstyle('left', (980-a+200)/2);
$('massage_box').setstyle('top', (window.screen.height-650)/2);
}
}).request();
}else{
alert('請按要求填寫完整,姓名,手機號碼,郵箱都是必填項');
}
}
/*
處理xml文檔
$.ajax() 使 ajax 由複雜變簡單
$.ajax({
url: 'document.xml',
type: 'get',
datatype: 'xml',
timeout: 1000,
error: function(){
alert('error loading xml document');
},
success: function(xml){
// do something with xml
}
});
當 success 回呼函數返回 xml 文檔後,您可以使用 jquery 檢索這個 xml 文檔,其方式與檢索 html 文檔是一樣的。這樣使得處理 xml 文檔變得相當地容易,並且把內容和Data Integration到了您的 web 網站裡面