jQuery Ajax È«½âÎö
jQueryȷʵÊÇÒ»¸öͦºÃµÄÇáÁ¿¼¶µÄJS¿ò¼Ü£¬ÄÜ°ïÖúÎÒÃÇ¿ìËٵĿª·¢JSÓ¦Ó㬲¢ÔÚÒ»¶¨³Ì¶ÈÉϸıäÁËÎÒÃÇдJavaScript´úÂëµÄÏ°¹ß¡£
·Ï»°ÉÙ˵£¬Ö±½Ó½øÈëÕýÌ⣬ÎÒÃÇÏÈÀ´¿´Ò»Ð©¼òµ¥µÄ·½·¨£¬ÕâЩ·½·¨¶¼ÊǶÔjQuery.ajax()½øÐзâ×°ÒÔ·½±ãÎÒÃÇʹÓõķ½·¨£¬µ±È»£¬Èç¹ûÒª´¦Àí¸´ÔÓµÄÂß¼£¬»¹ÊÇÐèÒªÓõ½jQuery.ajax()µÄ(Õâ¸öºóÃæ»á˵µ½).
1. load( url, [data], [callback] ) £ºÔØÈëÔ¶³Ì HTML Îļþ´úÂë²¢²åÈëÖÁ DOM ÖС£
url (String) : ÇëÇóµÄHTMLÒ³µÄURLµØÖ·¡£
data (Map) : (¿ÉÑ¡²ÎÊý) ·¢ËÍÖÁ·þÎñÆ÷µÄ key/value Êý¾Ý¡£
callback (Callback) : (¿ÉÑ¡²ÎÊý) ÇëÇóÍê³Éʱ(²»ÐèÒªÊÇsuccessµÄ)µÄ»Øµ÷º¯Êý¡£
Õâ¸ö·½·¨Ä¬ÈÏʹÓà GET ·½Ê½À´´«µÝµÄ£¬Èç¹û[data]²ÎÊýÓд«µÝÊý¾Ý½øÈ¥£¬¾Í»á×Ô¶¯×ª»»ÎªPOST·½Ê½µÄ¡£jQuery 1.2 ÖУ¬¿ÉÒÔÖ¸¶¨Ñ¡Ôñ·û£¬À´É¸Ñ¡ÔØÈëµÄ HTML Îĵµ£¬DOM Öн«½ö²åÈëɸѡ³öµÄ HTML ´úÂë¡£Óï·¨ÐÎÈç "url #some > selector"¡£
Õâ¸ö·½·¨¿ÉÒԺܷ½±ãµÄ¶¯Ì¬¼ÓÔØһЩHTMLÎļþ£¬ÀýÈç±íµ¥¡£
ʾÀý´úÂ룺
$(".ajax.load").load("http://www.csdn.net/",
function (responseText, textStatus, XMLHttpRequest){
this;//ÔÚÕâÀïthisÖ¸ÏòµÄÊǵ±Ç°µÄDOM¶ÔÏ󣬼´$(".ajax.load")[0]
//alert(responseText);//ÇëÇ󷵻صÄÄÚÈÝ
//alert(textStatus);//ÇëÇó״̬£ºsuccess£¬error
//alert(XMLHttpRequest);//XMLHttpRequest¶ÔÏó
});
2. jQuery.get( url, [data], [callback] )£ºÊ¹ÓÃGET·½Ê½À´½øÐÐÒì²½ÇëÇó²ÎÊý£ºurl (String) : ·¢ËÍÇëÇóµÄURLµØÖ·.data (Map) : (¿ÉÑ¡) Òª·¢Ë͸ø·þÎñÆ÷µÄÊý¾Ý£¬ÒÔ Key/value µÄ¼üÖµ¶ÔÐÎʽ±íʾ£¬»á×öΪQueryString¸½¼Óµ½ÇëÇóURLÖС£callback (Function) : (¿ÉÑ¡) ÔØÈë³É¹¦Ê±»Øµ÷º¯Êý(Ö»Óе±ResponseµÄ·µ»Ø״̬ÊÇsuccess²ÅÊǵ÷Óø÷½·¨)¡£ÕâÊÇÒ»¸ö¼òµ¥µÄ GET ÇëÇó¹¦ÄÜÒÔÈ¡´ú¸´ÔÓ $.ajax ¡£ÇëÇó³É¹¦Ê±¿Éµ÷Óûص÷º¯Êý¡£Èç¹ûÐèÒªÔÚ³ö´íʱִÐк¯Êý£¬ÇëʹÓà $.ajax¡£Ê¾Àý´úÂ룺 $.get("./Ajax.aspx", {Action:"get",Name:"lulu"}, function (data, textStatus){
//·µ»ØµÄ data ¿ÉÒÔÊÇ xmlDoc, jsonObj, html, text, µÈµÈ.
this; // ÔÚÕâÀïthisÖ¸ÏòµÄÊÇAjaxÇëÇóµÄÑ¡ÏîÅäÖÃÐÅÏ¢£¬Çë²Î¿¼ÏÂͼ
alert(data);
//alert(textStatus);//ÇëÇó״̬£ºsuccess£¬errorµÈµÈ¡£
µ±È»ÕâÀﲶ׽²»µ½error£¬ÒòΪerrorµÄʱºò¸ù±¾²»»áÔ
Ïà¹ØÎĵµ£º
<!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=gb2312" />
<script type="text/ ......
1. Accordion
¡¾¹¦ÄܸÅÊö¡¿Accordion¿ÉÒÔÈÃÄãÉè¼Æ¶à¸öpanel ²¢ÇÒÒ»´ÎÖ»ÏÔʾһ¸öPanel .ÔÚÒ³ÃæÉϵÄÏÔʾЧ¹û¾ÍÏñÊÇʹÓÃÁ˶à¸öCollapsiblePanelsÖ»²»¹ýÿһ´ÎÖ»Õ¹¿ªÆäÖÐÒ»¸ö CollapsiblePanel.Accordion¿Ø¼þÄÚ²¿°üº¬ÁËÈô¸É¸öAccordionPane£¬Ã¿Ò»¸öAccordionPaneµÄ templateÀï°üÀ¨Á˶ÔÆäHeaderºÍContentµÄ¶¨Òå¡£ÎÒÃÇ¿ÉÒÔÔÚºǫ́ ......
1.Ç°¡¢¶Ëºó¶¼Òª×öºÃ°²È«µÄ°Ñ¹Ø¹¤×÷
ÓÉÓÚAjaxÒ²»á½ÓÊÕºó¶Ë´«ËÍÀ´µÄ×ÊÁÏ£¬¶ÔÕâЩ×ÊÁ϶¼Òª²É²»ÐÅÈÎ̬¶È£¬±ØÐë¼ÓÒÔ¼ì²é¡£
2.¾¡Á¿ÒÔHTTP POST·½·¨´«Êä×ÊÁÏ
ËäÈ»POST²¢·ÇÍòÎÞһʧ£¬µ«±ÈÆðGETÖÁÉÙ½ÏΪ°²È«¡£
3.²»ÒªÖ±½ÓÓÃevalº¯Ê½»½ÆðJSONÎï¼þ
JSONÊDzÉÓÃJavaScriptÎï¼þʵ×ÖµÄ×ÊÁϸñʽ£¬´Óºó¶Ë´«µ½Ajax³Ìʽʱ£¬±ØÐë²ÉÓÃevalº ......
Background For the basic of how to create an AJAX enabled WCF service, please refer to MSDN: http://msdn.microsoft.com/en-us/library/bb924552.aspx. For the basic of JSONP, please refer to: http://en.wikipedia.org/wiki/JSON#JSONP. This article introduce how to make AJAX enabled WCF service support cr ......
ʼþ´¥·¢£º
<input name="keyword" onkeyup="LoadResults(this.value)" id="keyword" runat="server"/>
¿Í»§¶ËÖ÷Ì壺
//¶¨ÒåÓû§¿Ø¼þIDÈ«¾Ö±äÁ¿
var ClientID;
function ShowDiv(divid)
{
//...
}
function HideDiv(divid)
{
//...
}
//Ò³Ãæ¼ÓÔØʱµÄ´¦Àí
function BodyLoad()
{
HideD ......