jQuery ajax - get() ·½·¨

ʵÀý

ʹÓà AJAX µÄ GET ÇëÇóÀ´¸Ä±ä div ÔªËØµÄÎı¾£º

$("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 ±ØÐè¡£¹æ¶¨½«ÇëÇó·¢Ë͵ÄÄĸö URL¡£
data ¿ÉÑ¡¡£¹æ¶¨Á¬Í¬ÇëÇó·¢Ë͵½·þÎñÆ÷µÄÊý¾Ý¡£
success(response,status,xhr)

¿ÉÑ¡¡£¹æ¶¨µ±ÇëÇó³É¹¦Ê±ÔËÐеĺ¯Êý¡£

¶îÍâµÄ²ÎÊý£º

  • response - °üº¬À´×ÔÇëÇóµÄ½á¹ûÊý¾Ý
  • status - °üº¬ÇëÇóµÄ״̬
  • xhr - °üº¬ XMLHttpRequest ¶ÔÏó
dataType

¿ÉÑ¡¡£¹æ¶¨Ô¤¼ÆµÄ·þÎñÆ÷ÏìÓ¦µÄÊý¾ÝÀàÐÍ¡£

ĬÈϵأ¬jQuery ½«ÖÇÄÜÅжϡ£

¿ÉÄܵÄÀàÐÍ£º

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

Ïêϸ˵Ã÷

¸Ãº¯ÊýÊǼòдµÄ Ajax º¯Êý£¬µÈ¼ÛÓÚ£º

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

¸ù¾ÝÏìÓ¦µÄ²»Í¬µÄ MIME ÀàÐÍ£¬´«µÝ¸ø success »Øµ÷º¯ÊýµÄ·µ»ØÊý¾ÝÒ²ÓÐËù²»Í¬£¬ÕâЩÊý¾Ý¿ÉÒÔÊÇ XML root ÔªËØ¡¢Îı¾×Ö·û´®¡¢JavaScript Îļþ»òÕß JSON ¶ÔÏó¡£Ò²¿ÉÏò success »Øµ÷º¯Êý´«µÝÏìÓ¦µÄÎı¾×´Ì¬¡£

¶ÔÓÚ jQuery 1.4£¬Ò²¿ÉÒÔÏò success »Øµ÷º¯Êý´«µÝ XMLHttpRequest ¶ÔÏó¡£

ʾÀý

ÇëÇó test.php ÍøÒ³£¬ºöÂÔ·µ»ØÖµ£º

$.get("test.php");

¸ü¶àʾÀý

Àý×Ó 1

ÇëÇó test.php ÍøÒ³£¬´«ËÍ2¸ö²ÎÊý£¬ºöÂÔ·µ»ØÖµ£º

$.get("test.php", { name: "John", 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: "John", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  });
VUE