初學者必讀原生AJAX-非同步javaScript和XML

來源:互聯網
上載者:User

標籤:rip   str   條件   first   check   active   element   script   read   

1.前台頁面

<form action="#" method="post">  

  姓名<input type="text" name="first" id="first" />

  <span id="show"></span>

</form>

action="#" 是提交到本個頁面內

 

2.在head標籤元素加入AJAX代碼

其實這個AJAX功能即是這個check(str)函數

這個函數的功能即是:傳入一個字串HELLO到後台伺服器中,背景程式經過處理之後(假設這個程式的功能即是大寫轉換成小寫)再把hello傳給這個函數,然後這個函數負責把這個responseTest   hello插入到innerHTML文檔之中

這個實現AJAX的函數功能即是:傳入字串HELLO -------用open或者send方法把這個HELLO傳到背景處理常式

----幕後處理程式把大寫換成小寫hello------然後這個函數用document.getElementById("show").innerHTML=x.responseText;把處理好的hello插入到HTML頁面之中

去訊和面試第一次聽說阿賈克斯,本質就是一個函數,和後台互動的函數

<script type="text/javascript">    function check(str){    if(window.XMLHttpRequest){                 var x=new XMLHttpRequest();   //建立對象x    }else{        var x=new ActiveXObject("Microsoft.XMLHTTP");    }    x.open("GET","test2.php?c="+str+"&q="+new Date(),true);//open方法用戶端準備發送給test2.php處理    x.send();     //用戶端發送。這2步就是請求request    x.onreadystatechange=function ff(){        if(x.readyState==4 && x.status==200){//用戶端判斷條件    //用戶端顯示       document.getElementById("show").innerHTML=x.responseText;  }  }                }     </script>                            

 

3.背景程式

<?phpif($_GET["c"]==""){  //如果$_GET["c"]為空白echo "empty";    //就輸出empty}else{     //否則echo $_GET["c"];     //輸出發送過來的資料}?>

 

初學者必讀原生AJAX-非同步javaScript和XML

相關文章

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。