快捷導(dǎo)航

ajax實(shí)例入門代碼

更新時(shí)間：2008年11月18日 00:21:33 作者：

想學(xué)習(xí)ajax的朋友，如果剛開始接觸可以查看腳本之家的ajax欄目，之前的一些文章。

靜態(tài)頁面

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" > 
<head> 
<title>無標(biāo)題頁</title> 
<script type="text/javascript" src="jquery/jquery.js" > 
//這里不可以用<script type="" src="" /> 
</script> 
<script type="text/javascript"> 
/* 
encodeURI 方法 
對(duì)URL傳遞的參數(shù)進(jìn)行編碼 
將文本字符串編碼為一個(gè)有效的統(tǒng)一資源標(biāo)識(shí)符 (URI)。 
*/ 
function createQueryString(){ 
var firstName=encodeURI($("#firstName").val()); 
var birthday=encodeURI($("#birthday").val()); 
//組合成對(duì)象的形式 
var queryString={firstName:firstName,birthday:birthday}; 
return queryString; 
} 
function doRequestUsingGET(){ 
$.get("AjaxServe.aspx",createQueryString(), 
//發(fā)送GET請(qǐng)求 
function(data){ 
$("#serverResponse").html(decodeURI(data)); 
} 
); 
} 
function doRequestUsingPOST(){ 
$.post("AjaxServe.aspx",createQueryString(), 
//發(fā)送POST請(qǐng)求 
function(data){ 
$("#serverResponse").html(decodeURI(data)); 
} 
); 
} 
</script> 
</head> 
<body> 
<h2>輸入姓名和生日</h2> 
<form> 
<input type="text" id="firstName" /><br /> 
<input type="text" id="birthday" /> 

<input type="button" value="GET" onclick="doRequestUsingGET();" /><br /> 
<input type="button" value="POST" onclick="doRequestUsingPOST();" /> 
</form> 
<div id="serverResponse"></div> 
</body> 
</html> 

動(dòng)態(tài)頁面

復(fù)制代碼代碼如下:

protected void Page_Load(object sender, EventArgs e) 
{ 
//Response.Write("后臺(tái)數(shù)據(jù)"); 
if (Request.HttpMethod == "POST") 
Response.Write("POST:" + Request["firstName"] + ",your birthday is" + Request["birthday"]); 
else if(Request.HttpMethod=="GET") 
Response.Write("GET:" + Request["firstName"] + ",your birthday is" + Request["birthday"]); 
}

相關(guān)文章

ajax struts2 下拉框賦值(適合所有)
此代碼適合所有下拉列表取值;一個(gè)項(xiàng)目所有的下拉列表只需要這一個(gè)公用方法，接下來為大家詳細(xì)介紹下具體實(shí)現(xiàn)步驟，感興趣的朋友可以參考下，希望可以幫助到你
2013-03-03
Ajax實(shí)現(xiàn)頁面無刷新留言效果
這篇文章主要為大家詳細(xì)介紹了Ajax實(shí)現(xiàn)頁面無刷新留言效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-12-12
ajax跨頁面提交表單
這篇文章主要為大家詳細(xì)介紹了ajax跨頁面提交表單的相關(guān)資料,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-10-10
Ajax實(shí)現(xiàn)登錄案例
這篇文章主要為大家詳細(xì)介紹了Ajax實(shí)現(xiàn)登錄案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-09-09
ajax實(shí)現(xiàn)上傳圖片保存到后臺(tái)并讀取的實(shí)例
下面小編就為大家分享一篇ajax實(shí)現(xiàn)上傳圖片保存到后臺(tái)并讀取的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-01-01
ajax session過期問題的幾個(gè)解決方案
現(xiàn)在web開發(fā)中，ajax應(yīng)用的比較多。關(guān)于此方面的框架也不少。在應(yīng)用中都會(huì)遇到session過期的問題
2009-07-07
全面解析Ajax綜合應(yīng)用(全)
AJAX = 異步 JavaScript 和 XML，AJAX 是一種用于創(chuàng)建快速動(dòng)態(tài)網(wǎng)頁的技術(shù)。本文給大家?guī)砹巳娼馕鯝jax綜合應(yīng)用大全，非常不錯(cuò)具有參考借鑒價(jià)值，感興趣的朋友一起看下吧
2016-06-06
基于iframe實(shí)現(xiàn)ajax跨域請(qǐng)求獲取網(wǎng)頁中ajax數(shù)據(jù)
這篇文章主要介紹了基于iframe實(shí)現(xiàn)ajax跨域請(qǐng)求，并獲取網(wǎng)頁中ajax數(shù)據(jù)，如何利用網(wǎng)頁ajax請(qǐng)求暴露出來的接口去抓取網(wǎng)頁數(shù)據(jù)？需要的朋友可以參考下
2016-01-01
html+ajax實(shí)現(xiàn)上傳大文件功能
這篇文章主要為大家詳細(xì)介紹了html+ajax實(shí)現(xiàn)上傳大文件功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-11-11
Ajax實(shí)現(xiàn)動(dòng)態(tài)加載組合框的實(shí)例代碼
本文通過實(shí)例代碼給大家介紹了Ajax實(shí)現(xiàn)動(dòng)態(tài)加載組合框功能，感興趣的朋友一起看看吧
2017-08-08