»ùÓÚJQuery¿ò¼ÜµÄAJAX,AJAXµÄÈýÖÖʵÏÖ·½Ê½
»ùÓÚJQuery¿ò¼ÜµÄAJAX
ǰ¼¸Ìì·¢Á˸öÌù£¬·ÖÏíÁËprototype¿ò¼Ü¹ØÓÚAJAX·½ÃæµÄѧϰ¹ý³Ì¡£È»ºóÓÐÈË˵jquery¿ò¼Ü¸ü·½±ã¡£
ÕýºÃÏîÄ¿ÖÐ×¼±¸Ê¹ÓÃthickbox£¬ÓÚÊǸɴàÅׯúprototype.js£¬¿´Æðjquery.jsÁË¡£JQueryȷʵ²»´í£¬Ìå»ý±È PrototypeСÁËÐí¶à£¬¶øÇÒʹÓÃÆðÀ´¸ü·½±ã¸üÁé»î¡£ÓÐÈË˵PrototypeÏñJAVA£¬Õýͳ£»¶øJQueryÏñRuby£¬Áé»î£¬¸üÇ÷ÓÚOOP¡£
СÊÔÁËÏÂAJAX£¬¸Ð¾õ±Èprototype¼ò½à¶àÁË£¬ÔÚJQueryÖУ¬AJAXÓÐÈýÖÖʵÏÖ·½Ê½£º$.ajax(),$.post,$.get()¡£
XHTML(Ö÷Òª):
<div id="result" style="background:orange;border:1px solid red;width:300px;height:400px;"></div>
<form id="formtest" action="" method="post">
<p><span>ÊäÈëÐÕÃû:</span><input type="text" name="username" id="input1" /></p>
<p><span>ÊäÈëÄêÁä:</span><input type="text" name="age" id="input2" /></p>
<p><span>ÊäÈëÐÔ±ð:</span><input type="text" name="sex" id="input3" /></p>
<p><span>ÊäÈ빤×÷:</span><input type="text" name="job" id="input4" /></p>
</form>
<button id="send_ajax">Ìá½»</button>
<button id="test_post">POSTÌá½»</button>
<button id="test_get">GETÌá½»</button>
JS:
1¡¢ÒýÈëjquery¿ò¼Ü£º
<scrīpt type="text/javascrīpt" src="../js/jquery.js"></scrīpt>
2¡¢¹¹½¨AJAX£¬JQUERYµÄºÃ´¦ÊDz»ÐèÒªÔÚXHTMLÖÐʹÓÃJS´úÂëÀ´´¥·¢Ê¼þÁË£¬¿ÉÒÔÖ±½Ó·â×°ÔÚJSÎļþÖУº
<scrīpt type="text/javascrīpt">
//$.ajax()·½Ê½
$(document).ready(function (){
$('#send_ajax').click(function (){ //Ö±½Ó°ÑonclickʼþдÔÚÁËJSÖУ¬¶ø²»ÐèÒª»ìÔÚXHTMLÖÐÁË
var params=$('input').serialize(); //ÐòÁл¯±íµ¥µÄÖµ£¬ÓëprototypeÖеÄform.serialize()Ïàͬ
$.ajax({
url £º'ajax_test.php', //ºǫ́´¦Àí³ÌÐò
type:'post', //Êý¾Ý·¢ËÍ·½Ê½
dataType:'json', //½ÓÊ
Ïà¹ØÎĵµ£º
Microsoft AJAX Library
Microsoft AJAX Library[ÏÂÔØ]ÊÇ΢ÈíΪASP.NETµÄAJAX¹¦ÄÜÌṩµÄ¿Í»§¶ËJavascriptÀ©Õ¹Àà¿â¡£ËäÈ»ÊÇΪASP.NET±àдµÄ£¬µ«Í¬ÑùÊÊÓÃÓÚÆäËûÓïÑÔ¡£
ÓëÈç½ñ±»¹ã·ºÊ¹ÓõÄprototype¡¢jqueryµÈAJAXÀà¿âÏà±È£¬Microsoft AJAX LibraryLÁé»îÐÔ¿ÉÄܲ»×㣬¶øÇÒҲûÓÐÆäËûÀà¿â"Çá"£¬Èçprototy ......
1.ʲôÊÇAjax?
AjaxµÄÈ«³ÆÊÇ£ºAsynchronousJavaScript+XML
2.AjaxµÄ¶¨Ò壺
Ajax²»ÊÇÒ»¸ö¼¼Êõ£¬Ëüʵ¼ÊÉÏÊǼ¸ÖÖ¼¼Êõ£¬Ã¿ÖÖ¼¼Êõ¶¼ÓÐÆä¶ÀÌØÕâ´¦£¬ºÏÔÚÒ»Æð¾Í³ÉÁËÒ»¸ö¹¦ÄÜÇ¿´óµÄм¼Êõ¡£
3.Ajax°üÀ¨£º
XHTMLºÍCSS
ʹÓÃÎĵµ¶ÔÏóÄ£ÐÍ(DocumentObjectModel)×÷¶¯Ì¬ÏÔʾºÍ½»»¥
ʹÓÃXMLºÍXSLT×öÊý¾Ý½»»¥ ......
ÔÚÕâ¸ö±»Ajax¼¼ÊõͳÖεĻ¥ÁªÍøÊ±´ú£¬ºÜ¶àAjax³ÌÐò¶¼»áÔÚÒì²½¶ÁÈ¡Êý¾ÝµÄͬʱ£¬ÏÔʾһ¸öÕýÔÚ¶ÁÈ¡»òLoadingµÄ¶¯»£¬½ñÌì±òGoÒªÏò´ó¼Ò
ÍÆ¼öÒ»¸öÔÚÏßÉú³ÉLoadingÔ¤ÔØ¶¯»GifͼƬµÄÍøÕ¾£¬Ëü²»µ«ÌṩÁ˳¬¶àµÄLoading¶¯»Ñùʽ¹©ÄãÑ¡Ôñ£¬¶øÇÒÄ㻹¿ÉÒÔ×Ô¶¨Òå³ß´ç¡¢ÑÕÉ«µÈ²ÎÊý£¬¿É
ν·½±ãµ½¼Ò£¬×î×îÖØÒªµÄÊÇ£¬PreLoaders.net
Ìṩ ......
ÎÒÓÃActiveXObject("Microsoft.xmldom")À´×°ÔØxmlÎĵµÊ±£¬¾¹È»ÀÏÊÇÌáÊ¾×°ÔØÊ§°Ü£¬ºóÀ´ÉÏÍøËÑË÷ÁËÏ£¬ËµÊDz»ÄÜÖ±½Ó°üº¬Õâ5¸ö·ûºÅ£¨'><&"£©£¬±ØÐëÑ¡ÓÃ&xx;·½Ê½À´×ªÒ壬¿ÉÎÒÕÒ±éXMLҲû·¢ÏÖÕâЩ¡£
ºóÀ´ÎÒ¶ÀÐÐÅųý£¬²Å·¢ÏÖÓÐÒ»¸öÔªËØµÄÊôÐÔֵΪÓГ|”£¬È¥³ýºó¾ÍÕý³£ÁË¡£ÎÒÕæÊǾõµÃÆæ¹Ö£¬ÍøÉÏҲûÓÐ˵ ......
±¾ÎĵØÖ·: jQuery Ajax È«½âÎö
±¾ÎÄ×÷ÕߣºQLeelulu
×ªÔØÇë±êÃ÷³ö´¦£¡
jQueryȷʵÊÇÒ»¸öͦºÃµÄÇáÁ¿¼¶µÄJS¿ò¼Ü£¬ÄܰïÖúÎÒÃÇ¿ìËٵĿª·¢JSÓ¦Ó㬲¢ÔÚÒ»¶¨³Ì¶ÈÉϸıäÁËÎÒÃÇдJavaScript´úÂëµÄϰ¹ß¡£
·Ï»°ÉÙ˵£¬Ö±½Ó½øÈëÕýÌ⣬ÎÒÃÇÏÈÀ´¿´Ò»Ð©¼òµ¥µÄ·½·¨£¬ÕâЩ·½·¨¶¼ÊǶÔjQuery.ajax()½øÐзâ×°ÒÔ·½±ãÎÒÃÇʹÓõķ½·¨£¬µ±È»£¬Èç¹ ......