转载ajax
寫在前面的話:
用了很久的Asp.Net Ajax,也看了段時間的jquery中ajax的應用,但到頭來,居然想不起xmlHttpRequest的該如何使用了.
以前記的也不怎么清楚,這次就重新完整的學習一遍吧,也為了自己以后能找個完整的地方來復習.
什么是Ajax
Ajax的全稱是Asynchronous Javascript And XML.AJax由HTML,Javascript,DHTML和DOM組成.
HTML用于建立Web表單
Javascript代碼用于運行Ajax應用程序的核心代碼,用于和服務器引用程序進行通信
DHTML用于動態更新表單
DOM用于處理HTML結構和服務器返回的XML
時至今日,Js中可以處理的數據包括了字符串,JSON,XML數據.
優點
通過XMLHttpRequest對象來和服務器進行通信;在與服務器進行異步數據傳輸時,傳輸的數據更少;更好的用戶體驗.?
實例
get.htm頁面HTML代碼如下:
<body><label for="txt_username">姓名:</label><input type="text" id="txt_username" /><br /><label for="txt_age">年齡:</label><input type="text" id="txt_age" /><br /><input type="button" value="GET" id="btn" οnclick="btn_click();" /><div id="result"></div> </body>js代碼如下:
<script type="text/javascript">function btn_click() {//創建XMLHttpRequest對象var xmlHttp = new XMLHttpRequest();//獲取值var username = document.getElementById("txt_username").value;var age = document.getElementById("txt_age").value;//配置XMLHttpRequest對象xmlHttp.open("get", "Get.aspx?username=" + username+ "&age=" + age);//設置回調函數xmlHttp.onreadystatechange = function () {if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {document.getElementById("result").innerHTML = xmlHttp.responseText;}}//發送請求xmlHttp.send(null);} </script>新建Get.aspx頁,Get.aspx.cs代碼如下:
protected void Page_Load(object sender, EventArgs e) {Response.Clear();string username = Request.QueryString["username"];string age = Request.QueryString["age"];Response.Write("姓名:'" + username + "'<br/>年齡:" + age + "<br/>時間:'" + DateTime.Now.ToString() + "'");Response.End(); }結果:
輸入姓名和年齡,點擊Get按鈕,就會從服務器獲取到數據.
小結:
今天暫時寫一個完整的例子來顯示Ajax的調用過程,此例中存在許多問題:
針對這些已經出現的問題,我們在隨后的例子中會一一解決.
對于其他的疑問,比方說:
對于這些疑問,我們在隨后的文章里也會一一解決的.
轉載于:https://www.cnblogs.com/SmallNiu/p/4181846.html
總結
- 上一篇： 什么围棋要填一个字动词
- 下一篇： 如何使用WCF调试器WcfTestCli