jQuery ajax - วิธี get()

jQuery Ajax คู่มืออ้างอิง

ตัวอย่าง

เปลี่ยนข้อความขององค์ประกอบ div ด้วยคำร้อง GET ผ่าน AJAX

$("button").click(function(){
  $.get("demo_ajax_load.txt", function(result){
    $("div").html(result);
  });
});

ทดลองด้วยตัวเอง

คำนิยามและวิธีใช้

วิธี get() โหลดข้อมูลผ่าน HTTP GET รีクวิสต์ทางระยะไกล

นี่คือฟังก์ชัน GET ง่ายๆ ที่ใช้แทน $.ajax ที่ซับซ้อน。เมื่อสำเร็จ สามารถเรียกฟังก์ชันคอลบ래คค้นหาได้ ถ้าต้องการที่จะทำฟังก์ชันเมื่อมีข้อผิดพลาด ใช้ $.ajax ด้วย

ภาษา

$(selector).get()}}url,data,success(response,status,xhr),dataType)
ประกาย รายละเอียด
url จำเป็น
data ตัวเลือก
success(response,status,xhr)

ตัวเลือก

ประกายเพิ่มเติม:

  • response - มีข้อมูลผลลัพธ์จากคำขอ
  • status - มีสถานะของคำขอ
  • xhr - มี XMLHttpRequest object
dataType

ตัวเลือก

โดยมาตรฐาน jQuery จะตรวจสอบอัตโนมัติ

ประเภทที่เป็นไปได้:

  • "xml"
  • "html"
  • "text"
  • "script"
  • "json"
  • "jsonp"

รายละเอียด

ฟังก์ชันนี้เป็น Ajax ฟังก์ชันที่ย่อย ซึ่งเท่ากับ:

$.ajax({
  url: url,
  data: data,
  success: success,
  dataType: dataType
});

ตาม MIME 类型ที่ตอบกลับของเซิร์ฟเวอร์ ข้อมูลที่ส่งไปยังฟังก์ชัน callback ที่ success ก็จะแตกต่างกัน ซึ่งอาจเป็น XML root element, text string, JavaScript file หรือ JSON object ซึ่งก็สามารถส่ง status text ที่ตอบกลับไปด้วย

สำหรับ jQuery 1.4 ก็สามารถส่ง XMLHttpRequest ต่อไปยังฟังก์ชัน callback ที่ success ได้

ตัวอย่าง

ขอหน้าเว็บ test.php และละเลยค่าที่ส่งกลับ:

$.get("test.php");

ตัวอย่างเพิ่มเติม

ตัวอย่าง 1

ขอหน้าเว็บ test.php โดยส่ง 2 ค่าประมาณการ และละเลยค่าที่ส่งกลับ:

$.get("test.php", { name: "Bill", time: "2pm" } );

ตัวอย่าง 2

แสดงค่าที่ส่งกลับโดย test.php (HTML หรือ XML ตามที่ส่งกลับ):

$.get("test.php", function(data){
  alert("Data Loaded: " + data);
});

ตัวอย่าง 3

แสดงค่าที่ส่งกลับโดย test.cgi (HTML หรือ XML ตามที่ส่งกลับ) และเพิ่มค่าประมาณการของคำขอ:

$.get("test.cgi", { name: "Bill", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  });

jQuery Ajax คู่มืออ้างอิง