ʹÓÃjquery¼ò»¯ajax¿ª·¢
jQuery ÊÇʲô£¿
Çë·ÃÎÊ Ajax ¼¼Êõ×ÊÔ´ÖÐÐÄ£¬ÕâÊÇÓÐ¹Ø Ajax ±à³ÌÄ£ÐÍÐÅÏ¢µÄһվʽÖÐÐÄ£¬°üÀ¨ºÜ¶àÎĵµ¡¢½Ì³Ì¡¢ÂÛ̳¡¢blog¡¢wiki ºÍÐÂÎÅ¡£ÈκΠAjax µÄÐÂÐÅÏ¢¶¼ÄÜÔÚÕâÀïÕÒµ½¡£
jQuery ÓÉ John Resig ´´½¨ÓÚ 2006 Äê³õ£¬¶ÔÓÚÈκÎʹÓà JavaScript ´úÂëµÄ³ÌÐòÔ±À´Ëµ£¬ËüÊÇÒ»¸ö·Ç³£ÓÐÓÃµÄ JavaScript ¿â¡£ÎÞÂÛÄúÊǸոսӴ¥ JavaScript ÓïÑÔ£¬²¢ÇÒÏ£Íû»ñµÃÒ»¸öÄܽâ¾öÎĵµ¶ÔÏóÄ£ÐÍ£¨Document Object Model£¬DOM£©½Å±¾ºÍ Ajax ¿ª·¢ÖÐһЩ¸´ÔÓÎÊÌâµÄ¿â£¬»¹ÊÇ×÷Ϊһ¸öÑá¾ëÁË DOM ½Å±¾ºÍ Ajax ¿ª·¢ÖÐÎÞÁĵÄÖØ¸´¹¤×÷µÄ×ÊÉî JavaScript ר¼Ò£¬jQuery ¶¼»áÊÇÄúµÄÊ×Ñ¡¡£
jQuery ÄܰïÖúÄú±£Ö¤´úÂë¼ò½àÒ×¶Á¡£ÄúÔÙÒ²²»±Ø±àд´ó¶ÑÖØ¸´µÄÑ»·´úÂëºÍ DOM ½Å±¾¿âµ÷ÓÃÁË¡£Ê¹Óà jQuery£¬Äú¿ÉÒÔ°ÑÎÕÎÊÌâµÄÒªµã£¬²¢Ê¹Óþ¡¿ÉÄÜ×îÉٵĴúÂëʵÏÖÄúÏëÒªµÄ¹¦ÄÜ¡£
ºÁÎÞÒÉÎÊ£¬jQuery µÄÔÀíÊǶÀÒ»ÎÞ¶þµÄ£ºËüµÄÄ¿µÄ¾ÍÊDZ£Ö¤´úÂë¼ò½à²¢¿ÉÖØÓᣵ±ÄúÀí½â²¢Ìå»áÕâÒ»ÔÀíºó£¬±ã¿ÉÒÔ¿ªÊ¼Ñ§Ï°±¾½Ì³ÌÁË£¬¿´¿´ jQuery ¶ÔÎÒÃǵıà³Ì·½Ê½ÓжàÉٸĽø°É¡£
»ØÒ³Ê×
һЩ¼òµ¥µÄ´úÂë¼ò»¯
ÏÂÃæÊÇÒ»¸ö¼òµ¥Ê¾Àý£¬Ëü˵Ã÷ÁË jQuery ¶Ô´úÂëµÄÓ°Ïì¡£ÒªÖ´ÐÐÒ»Ð©ÕæÕý¼òµ¥ºÍ³£¼ûµÄÈÎÎñ£¬±È·½ËµÎªÒ³ÃæµÄÄ³Ò»ÇøÓòÖеÄÿ¸öÁ´½Ó¸½¼ÓÒ»¸öµ¥»÷£¨click£©Ê¼þ£¬Äú¿ÉÒÔʹÓô¿ JavaScript ´úÂëºÍ DOM ½Å±¾À´ÊµÏÖ£¬Èç Çåµ¥ 1 Ëùʾ¡£
Çåµ¥ 1. ûÓÐʹÓà jQuery µÄ DOM ½Å±¾
var external_links = document.getElementById('external_links');
var links = external_links.getElementsByTagName('a');
for (var i=0;i < links.length;i++) {
var link = links.item(i);
link.onclick = function() {
return confirm('You are going to visit: ' + this.href);
};
}
Çåµ¥ 2 ÏÔʾÁËʹÓà jQuery ʵÏÖµÄÏàͬµÄ¹¦ÄÜ¡£
Çåµ¥ 2. ʹÓÃÁË jQuery µÄ DOM ½Å±¾
$('#external_links a').click(function() {
return confirm('You are going to visit: ' + this.href);
});
ÊDz»ÊǺÜÉñÆæ£¿ ʹÓà jQuery£¬Äú¿ÉÒÔ°ÑÎÕÎÊÌâµÄÒªµã£¬Ö»ÈôúÂëʵÏÖÄúÏëÒªµÄ¹¦ÄÜ£¬¶øÊ¡È¥ÁËһЩ·±ËöµÄ¹ý³Ì¡£ÎÞÐè¶ÔÔªËØ½øÐÐÑ»·£¬click() º¯Êý½«Íê³ÉÕâЩ²Ù×÷¡£Í¬ÑùÒ²²»ÐèÒª½øÐжà¸ö DOM ½Å±¾µ÷Óá£ÄúÖ»ÐèҪʹÓÃÒ»¸ö¼ò¶ÌµÄ×Ö·û´®¶ÔËùÐèµÄÔªËØ½øÐж¨Òå¼´¿É¡£
Àí½âÕâÒ»´úÂëµÄ¹¤×÷ÔÀí¿ÉÄÜ»áÓÐÒ»µã¸´ÔÓ¡£Ê×ÏÈ£¬ÎÒÃÇʹÓÃÁË $() º¯Êý —— jQuery Öй¦ÄÜ×îÇ¿´óµÄº¯Êý¡£Í¨³££¬ÎÒÃ
Ïà¹ØÎĵµ£º
±¾ÀýÊDzÉÓÃJSP + Ajax + Îı¾À´ÑÝʾ¶àÑ¡¡¢È«Ñ¡£¬Ìí¼Ó¡¢É¾³ý¡¢¸üÐÂcheckbox¶àÑ¡¿òµÄЧ¹û£»³ä·ÖÕ¹ÏÖÁËÀûÓÃJavaScript¿ØÖÆHTML DOMÒÔ¼°ÀûÓÃXML http ´«µÝÊý¾Ý£¬ÀûÓÃJSP²Ù×÷Îı¾µÄЧ¹û¡£
¡¡¡¡1.JavaScript ÓÃÀ´¿ØÖÆÒ³ÃæÄÚÈݵÄÏÖʵÓëÔöɾЧ¹û£»
¡¡¡¡2.JSP×÷Ϊºǫ́£¬¶ÔÎı¾½øÐжÁÈ¡¡¢Ð´Èë¡¢¸üеȲÙ×÷£»
¡¡¡¡3.Îı¾¸ñʽÊÇÓÃÀ´´ ......
ºÜ¶àÅóÓÑÎÊÎÒÈçºÎʵÏÖÎÞË¢ÐÂÉÏ´«Í¼Æ¬,ÕâÀïСºÚ¸ø´ó¼ÒÕÒÁËһƪ¹ØÓÚÎÞË¢ÐÂʵÏÖͼƬÉÏ´«µÄÎÄÕÂ,Ï£Íû¶Ô´ó¼ÒÓаïÖú.
±¾ÎĿͷþ¶ËʹÓõÄÊÇajax.netÒì²½ÉÏ´«Îļþ
1.ÔÚ
protected void Page_Load(object sender, EventArgs e)
{
Ajax.Utilit ......
JSON²å¼þÌṩÁËÒ»ÖÖÃûΪjsonµÄResultType£¬Ò»µ©ÎªÄ³¸öActionÖ¸¶¨ÁËÒ»¸öÀàÐÍΪjsonµÄResult£¬Ôò¸ÃResultÎÞÐèÓ³Éäµ½ÈκÎÊÓͼ×ÊÔ´¡£ÒòΪJSON²å¼þ»á¸ºÔð½«ActionÀïµÄ״̬ÐÅÏ¢ÐòÁл¯³ÉJSON¸ñʽµÄÊý¾Ý£¬²¢½«¸ÃÊý¾Ý·µ»Ø¸ø¿Í»§¶ËÒ³ÃæµÄJavaScript¡£
¡¡¡¡¼òµ¥µØËµ£¬JSON²å¼þÔÊÐíÎÒÃÇÔÚJavaScriptÖÐÒì²½µ÷ÓÃAction£¬¶øÇÒAction²»ÔÙÐè ......
ÔÚAjax url´«²Îʱ³öÏÖÖÐÎÄÂÒÂëµÄÇé¿ö
Àý1: xmlHttp.open("GET","Engine.aspx?Action=getmainsort&Type=2&Parent="+escape("ÖÐÎÄ")+"&Stochastic=" + Math.random(),true);
µ«ÊÇÕâ¸öÖ»ÄÜÆÕͨµÄ<a href=''.ÓÐЧ¹û¡£Èç¹ûÊÇajax´«ÖµµÄ»°»¹ÊDz»ÐеÄ...ÓÐÈËÌá³ö:Òª ......
Client¶Ë
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<script language="javascript">
var XmlHttp=new ActiveXObject("Microsoft.XMLhttp");
function sendAJAX()
{
&nb ......