test AJAX

Topic: 
 




Test AJAX

ทดสอบ AJAX

เอาโค้ดมาจาก http://www.DynamicAJAX.com

ตรงนี้เป็นบรรทัดธรรมดา

ตรงนี้เป็นลิงก์ โหลดไฟล์ ajax1.txt มาแสดง

ตรงนี้เป็นลิงก์ โหลดไฟล์ ajax2.txt มาแสดง

ตรงนี้เป็นบรรทัดที่จะแทรกข้อความที่รับจาก AJAX

    แทรกตรงนี้

ตรงนี้กลับมาเป็นบรรทัดธรรมดา

อธิบายมากไม่ได้ เพราะไม่มีความรู้ :P ได้แค่คัดลอกโค้ดมาให้ดูเฉย ๆ

เนื้อไฟล์ index.html

<!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>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>Test AJAX</title>
</head>
<body>
<script language="javascript" type="text/javascript">
// SEE FULL CODE AT http://www.DynamicAJAX.com

function getXmlHttpRequestObject() {
  if (window.XMLHttpRequest) {
    return new XMLHttpRequest(); //Not IE
  } else {
    if(window.ActiveXObject) {
      return new ActiveXObject("Microsoft.XMLHTTP"); //IE
    } else {
      alert("Your browser doesn't support the XmlHttpRequest object. Better upgrade to Firefox.");
    }
  }
}

var receiveReq = getXmlHttpRequestObject();

function d_say(action) {
  if (receiveReq.readyState == 4 || receiveReq.readyState == 0) {
    receiveReq.open("GET",action, true);
    receiveReq.onreadystatechange = d_handle;
    receiveReq.send(null);
  }
}

function d_handle() {
  if (receiveReq.readyState == 4) {
    document.getElementById('d_span').innerHTML = receiveReq.responseText;
  }
}
</script>

<strong>ทดสอบ AJAX</strong>
<p>เอาโค้ดมาจาก <a href="http://www.dynamicajax.com">http://www.DynamicAJAX.com</a></p>

<br />
<br />
<p>ตรงนี้เป็นบรรทัดธรรมดา</p>
<p>ตรงนี้เป็นลิงก์ <a href="javascript:d_say('files/ajax1.txt');">โหลดไฟล์ ajax1.txt มาแสดง</a></p>
<p>ตรงนี้เป็นลิงก์ <a href="javascript:d_say('files/ajax2.txt');">โหลดไฟล์ ajax2.txt มาแสดง</a></p>
<br />
<br />
<p>ตรงนี้เป็นบรรทัดที่จะแทรกข้อความที่รับจาก AJAX
<ul><div id="d_span">แทรกตรงนี้</div></ul></p>
<br />
<br />

<p>ตรงนี้กลับมาเป็นบรรทัดธรรมดา</p>
</body>

เนื้อไฟล์ ajax1.txt

ตอนนี้เอาเนื้อไฟล์ ajax1.txt มาใส่<br />
บรรทัดที่สองของ ajax1.txt

เนื้อไฟล์ ajax2.txt

เปลี่ยนแล้วจ๊ะ<br />
ตอนนี้เอาเนื้อไฟล์ ajax2.txt มาใส่<br />
บรรทัดที่สามของ ajax2.txt
AttachmentSize
Plain text icon ajax1.txt143 bytes
Plain text icon ajax2.txt192 bytes

Comments

 

ลิงก์นี้อธิบายดีมาก แต่เป็น pdf นะ

Web-tier Programming Codecamp II : AJAX

 

Wow! That is truly amazing!!

 

Syndicate

Subscribe to Syndicate

Who's online

There are currently 0 users online.