slideViewerPro使用配置说明 http://www.oschina.net/p/slideviewerpro
Can I make the Jquery slideViewer autoplay?
<scripttype="text/javascript">
var theLinks;
var nCount =0;
var theTimerID;
function init(){
$("div#mygalone").slideView();
theLinks = jQuery('#stripTransmitter0 a');
//for kill interval purposes
theTimerID = setInterval("autoSlide()",5000);
}
function autoSlide(){
jQuery.each(theLinks,function(i){
if(jQuery(this).hasClass('current')){
jQuery(theLinks[((i+1< theLinks.length)?(i+1):0)]).trigger("click");
returnfalse;
}
});
}
$(window).bind("load", init );
</script>
The way I see it you basically have 3 options here:
(1) - Use slideViewPro, but disable thumbnails using the thumbsVis:false option as shown below
$("div#noui").slideViewerPro({
galBorderWidth:0,
autoslide:true,
thumbsVis:false,
shuffle:true
});
(2) - Switch to using the jQuery cycle plug-in instead
(3) - Edit the source code of original slideViewer and add your own autoslide implementation by using timers and firing the click event on the navigation.
]]>
q是一些分析jQuery框架的文?
针对jQuery 1.3.2版本
面向的读者应具备以下要求
1.非常熟?zhn)HTML
2.非常熟?zhn)javascript语法知识
3.熟?zhn)javascript面向对象斚w的知?/p>
4.熟练使用jQuery框架
a归正传！
jQuery对象的初始化是写在匿名函数里?/p>
像q样Q?/p>
QfunctionQ）{alertQ?jQuery框架分析"Q}Q（Q；
W一个括h声明了一个函敎ͼW二个括h执行q个函数。也是_(d)jQuery框架在页面蝲入的时候已l做了一些事情（q个个匿名函数已l被执行了）? 做的q些事情使我们可以通过$Q?#yourId"Q或$Q?.yourClass"Q等方式获取面元素Qƈ把获取到的元素包装成jQuery对象?/p>
匿名函数是怎么实现q些功能的呢Q?/p>
首先框架定义了两个核心对?/p>
jQuery = window.jQuery = window.$ = functionQ?selectorQ?context Q?{}
一个是jQuery
一个是$
q两个对象都指向一个函?/p>
q个函数是我们?Q）或jQueryQ）Ҏ(gu)时的入口Q这个方法返回一个jQuery.fn.initQ?selectorQ?context Q；的实例，其实q个实例是一个jQuery对象?/p>
jQuery对象是一个什么样的对象呢Q?/p>
jQuery对象其实是一个javascript的数l?/p>
q个数组对象包含125个方法和4个属?/p>
4个属性分别是
jQuery 当前的jQuery框架版本?/p>
length 指示该数l对象的元素个数
context 一般情况下都是指向HtmlDocument对象
selector 传递进来的选择器内容?如：(x)#yourId或。yourClass{?/p>
如果你通过$Q?#yourId"Q方法获取jQuery对象Qƈ且你的页面中只有一个id为yourId的元素那?Q?#yourId"Q[0]是 HtmlElement元素与document.getElementByIdQ?yourId"Q获取的元素是一L(fng)
jQuery对象是怎么构造出来的呢？
q个对象是刚才我们提到?/p>
jQuery = window.jQuery = window.$ = functionQ?selectorQ?context Q?{}
框架不只为此对象定义了一个方法，q定义了它的原型QprototypeQ?/p>
jQueryjQuery.fn = jQuery.prototype = {//此处为json对象}
原型的定义是通过json对象定义?/p>
?/p>
{
initQ?functionQ?selectorQ?context Q?{//Ҏ(gu)体}Q?/p>
jQueryQ?"1.3.2"Q?/属?/p>
sizeQ?functionQ） {//Ҏ(gu)体}Q?/p>
//…?/p>
}
前面提到?25个方?个属性有一部分在这个json对象中完成定义的 q个json对象中第一个方法就是initҎ(gu)也就是入口方法中的jQuery.fn.initQ?selectorQ?context Q；此方法与一个正则表辑ּ对象配合来构造jQuery对象
q个正则表达式ؓ(f)Q?/p>
quickExpr = /^[^<]*Q?lt;Q。|\sQ?>Q[^>]*$|^#Q[\w-]+Q?/
下面我们说一下initҎ(gu)的实现逻辑
此方法有两个参数
一个是selectorQ选择器）
一个是contextQ上下文Q?/p>
selector是我们?Q?#yourId"Q或jQueryQ?.yourClass"Q传递进来的变量
q个参数不一定是字符Ԍ也可能是其他形式的变?/p>
{会(x)儿我们就?x)介l到
context参数我们在用jQuery的时候很用刎ͼ暂且不表
注意q两个参数都在返回的jQuery对象中体现出来了Q以两个同名的属性展C）
下面看一下这个方法体内部的实现逻辑
//如果没有选择器或者选择器ؓ(f)I的话，把document对象赋值给?br />selector = selector || document;
//如果selector参数是dom元素Q直接返回jQuery对象
//也就是说你可?(document.getElementById("allen"))把你的元素封装成jQuery对象
if ( selector.nodeType ) {
this[0] = selector;
this.length = 1;
this.context = selector;
return this;
}
//typeof 取对象的cdQ用三个{号效率较高Q?不需要类型{换，两个{号默认有类型{?br />if ( typeof selector === "string" ) {
//q里用到了我们前面提到的正则表达式quickExpr
//match其实是一个数l?br />//W?个元素是与正则表辑ּ相匹配的文本
//W?个元素是与正则表辑ּ的第1个子表达式相匚w的文本（如果有的话）
//W?个元素是W?个子表达式相匚w的文本（如果有的话）
//W?个元素是W?个子表达式相匚w的文本（如果有的话）q里是元素的IDQ不包含#
var match = quickExpr.exec( selector );
//正则表达式匹配到了内容 ?q且 match[1]不ؓ(f)I?或?context为空
//match[1]不ؓ(f)I的时候selector是HTML字符Ԍ也就是你可以?("
xland
")把对象包装成jQuery对象
//context为空的时候selector是页面元素ID
if ( match && (match[1] || !context) ) {
//选择器ؓ(f)html字符串?此情冉|且不?br />if ( match[1] ){
selector = jQuery.clean( [ match[1] ], context );}
//选择器ؓ(f)ID
else {
//得到元素
var elem = document.getElementById( match[3] );
//如果得到了这个元素但是元素的ID属性不是match[3]Q蟩入分支。分支里面的东西做了什么工作，暂且不表
if ( elem && elem.id != match[3] ){
return jQuery().find( selector );}
//把得到的面元素装成jQuery对象
//如果elem为空Q就传入一个空数组Q框架怎么处理此空数组Q暂且不?br />//如果不ؓ(f)I就跛_我们前面说的if ( selector.nodeType )分支Q构造出jQuery对象?br />var ret = jQuery( elem || [] );
//讄jQuery对象的context属?br />ret.context = document;
//讄jQuery对象的selector属?br />ret.selector = selector;
//q回q个对象l调用?br />return ret;
}
x
var obj = $Q?yourId”）Q?/p>
构造jQuery对象的初步工作就做完?/p>
]]>
- Local proxy:
- Needs infrastructure (can't run a serverless client) and you get double-taxed on bandwidth and latency (remote - proxy - client).
- Flash:
- Remote host needs to deploy a crossdomain.xml file, Flash is relatively proprietary and opaque to use, requires learning a one-off moving target programming langage.
- Script tag:
- Difficult to know when the content is available, no standard methodology, can be considered a "security risk".
以上Ҏ(gu)都各有缺P都不是很好多解决Ҏ(gu)。后来出C一U叫JSON with Padding 的技术，U?JSONP .Q原理参考http://bob.pythonmac.org/archives/2005/12/05/remote-json-jsonp/Q，? 用JSONP可以实现JSON数据的跨域调用。非常的q运QJQuery1.2以后支持JSONP的应用。下面侧重说明在JQuery中，Json的跨? 调用?/p>
应用JSONP实现Json数据跨域调用Q需要服务器端与客户端的合作完成。引用Jquery官方的例子，客户端掉用如下：(x)
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?",
function(data){
$.each(data.items, function(i,item){
$("<img/>").attr("src", item.media.m).appendTo("#images");
if ( i == 3 ) return false;
});
});
注意q里调用的地址中jsoncallback=?是关键的所在！其中Q符号会(x)被Query自动替换成其他的回调Ҏ(gu)的名Uͼ具体q程和原理我们这里不? ?x)。我们关心的是jsoncallback=?起什么作用了Q原来jsoncallback=?被替换后Q会(x)把方法名UCl服务器。我们在服务器端要做什 么工作呢Q服务器要接受参数jsoncallbackQ然后把jsoncallback的g为JSON数据Ҏ(gu)名称q回Q比如服务器是JSP,我们?x)? 样做Q?/p>
...
String jsoncallback=request.getParameter("jsoncallback");
...
out.print(jsoncallback+"({\"account\":\"XX\",\"passed\":\"true\",\"error\":\"null\"})");
Jquery取得的数据可能如下：(x)
JQUET0988788({"account":"XX","passed":"true","error":"null"})
ȝQ用JSONP要做两g事：(x)
1/h地址加参敎ͼ(x)jsoncallback=?
2/服务器段把jsoncallback的g为方法名传回来，如JQUET098788(...)
参考：(x)
http://www.javaeye.com/topic/169765
http://www.javaeye.com/topic/260647
]]>
如果引入jquery后再引入
Scriptaculous?code>effects.js,可能出现莫名其妙的问题?br />jQuery("#id")正常Q但cM于jQuery("name='test'")之类的查询就?x)出错?br />原因是旧版本(1.5.1)?code>effects.js里有代码污染了Array的callҎ(gu)Array.prototype.call = function() {
var args = arguments;
this.each(function(f){ f.apply(this, args) });
}
var args = arguments;
this.each(function(f){ f.apply(this, args) });
}
参考一
参考二
http://www.javaeye.com/topic/84683
http://www.javaeye.com/topic/184859
]]>
]]>
]]>
关于ajax的应用，异步q发Q导致的问题
http://www.tkk7.com/emu/archive/2005/11/22/20888.html
CACHE
如果使用xmlhttp控gQ在发vhttph的时候IE?x)包办cache{略Q很多时候更C数据却无法获得更新后的数据。一开始试囄传统方式在URL后面加随机数来强制更斎ͼ但是IE仍然距不发出新的h?br />
一个解x法是在后台写expires: 0或者其他的止前台cache的头Q但是这样在数据没有更新的时候又?x)带来不必要的服务器压力、响应gq和带宽费?br />一个稍微好一点的解决Ҏ(gu)是，前台在提交数据以后，需要强制更新数据的时候：(x)
xmlhttp.setRequestHeader("If-Modified-Since","0");
]]>
suggested patch for div on top of flash frame problem in IE7
2,dimensions
http://plugins.jquery.com/project/dimensions
http://brandonaaron.net/docs/dimensions/
3,suggest
http://www.vulgarisoip.com/2007/06/29/jquerysuggest-an-alternative-jquery-based-autocomplete-library/
4,hotkey
$.hotkeys.add('Ctrl+c', function(){ alert('copy anyone?');});
$.hotkeys.remove('Ctrl+c');
http://code.google.com/p/js-hotkeys/
http://plugins.jquery.com/project/clickOrEnter
5,validate
http://jquery.bassistance.de/validate/demo/
猫冬的表单验证插?br />http://www.cnblogs.com/wzmaodong
http://www.yhuan.com/formvalidator/userguide.html
6,png fix插g
解决png在IE5,6下的昄问题
使用:
$("#testdiv").pngFix(); http://plugins.jquery.com/project/pngFix
http://jquery.andreaseberhard.de/pngFix/
7,Accordion
应该是用最多的jquery accordian.回复比较?br />http://bassistance.de/jquery-plugins/jquery-plugin-accordion/
http://groups.google.com/group/jquery-ui/topics 作者要求回复到q里
8,hoverIntent
能根据鼠标的UdUd速度和是否停留进行相应的处理
http://cherne.net/brian/resources/jquery.hoverIntent.html
9,slideqȝ效果
http://www.malsup.com/jquery/cycle/
10,tooltip
http://jquery.bassistance.de/tooltip/demo/
11,ajax Queue
好像是支持按照发求的序来依ơ执行回调函?不处理的话快速发出大量请求时响应?x)??br />某h的评?
The uses of this plugin are pretty obscure to most people. This plugin helps you deal with situations where a javascript function is completing before you intend for it, and allowing other functions to execute, while a crucial function somewhere is still processing. Some know what I’m talking about?this plugin was absolutely crucial for our ajax comments. God bless the authors.
http://plugins.jquery.com/project/ajaxqueue
12,corner
$(this).corner("round");
http://www.methvin.com/jquery/jq-corner-demo.html
13,truncate 截断字符?br />http://www.cssrain.cn/demo/truncate-2.2/index.html
14,contextmenu
http://www.trendskitchens.co.nz/jquery/contextmenu/
15,progress bar
http://digitalbush.com/projects/progress-bar-plugin
http://www.jb51.net/article/13993.htm?br />16,multiple-file-upload
http://www.fyneworks.com/jquery/multiple-file-upload/
17Qeasydrag
http://fromvega.com/wordpress/2007/07/14/easydrag-jquery-plugin/
z的拖动功能实现。比 interface 插g的简单很多，Ҏ(gu)动有很高要求的可以参考这个插件来定制?a >http://space.cnblogs.com/RChen/木野狐对此插件稍有修改，在两帖子里有介l（扩展?jquery 的插?easy drag , 漂QH口拖动杂谈Q箋Q?/font> Q?br />18,jCarouselLite
http://gmarwaha.com/jquery/jcarousellite/index.php
19,chartotable
http://www.hovinne.com/dev/jquery/chartotable/ 好玩
20,scroll 滚动
http://www.gcmingati.net/wordpress/wp-content/lab/jquery/newsticker/jq-liscroll/scrollanimate.html
http://jscroller.markusbordihn.de/example/left/
http://www.kelvinluck.com/assets/jquery/jScrollPane/jScrollPane.html
21,calculation计算插g
$("input[@name='price1'], input[@name='price2'], input[@name='price3']").sum("keyup", "#totalprice")
q个插g也没有考虑四舍五入的问?例如1.3+2.667
http://www.pengoworks.com/workshop/jquery/calculation/calculation.plugin.htm
22,jQuery Easing ~和?
http://gsgd.co.uk/sandbox/jquery/easing/
23,livequery
能自动给动态添加的元素l定事g。京东商城用了?br />http://feiyu.asgard.cn/article_155.html
24,jtemplates
Template engine in JavaScript. Plugin to jQuery.
http://jtemplates.tpython.com/
http://hi.baidu.com/df1019/blog/item/42ba7ffbfea208106c22eb53.html
http://hi.baidu.com/df1019/blog/item/d4cfbd2b380863fce6cd4089.html
http://www.tkk7.com/OneEyeWolf/archive/2008/11/17/240999.html
25,jcache
A client-side caching plugin
http://www.skidvn.com/jcache
http://www.hackeye.com/article/5487/
26,
Jquery Floating Box Plugin
http://www.phpletter.com/Demo/Jquery-Floating-Box-Plugin/
27,clickmenu
多菜单 http://p.sohei.org/jquery-plugins/clickmenu
28,
jCarousel 是个非常好看又好用的内容滚动切换插gQ可以实现按序水qx垂直方向的内容列表的切换?br />
50多个强大的jQuery插g应用实例
45个新鲜出炉的jQuery插g
37个更加出色的jQuery插g
]]>
(1)如果用keydown,用中文输入法时在输入框里输汉语拼音的字母׃(x)有感?故只能用keyup
(2)后退问题.
如何区分是在中文输入法的输入框里的后退Q还是自动完成录入框里的后退Q二者的处理是不一L(fng)?br /> (3)认?br /> 光标在form里时Q按认键浏览器?x)自动提交。而我惌的是一按确认键Q自动录入选中的那一V?br />如何在按认键时不让form截获q个事g。要做成通用的，而不是在每一个form里写歅R?br /> (4)调试时慎用alert
alert然后定时会(x)自动执行blur,?x)媄响的原来E序的执行次?br />
2,插g
(1)http://code.google.com/p/jqac/ 不错
(2)http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete 很好很强?br /> (3)http://www.dyve.net/jquery/?autocomplete 有遮盖select box功能
(4)http://docs.jquery.com/Plugins/AutoComplete
(5)http://mabp.kiev.ua/content/2008/04/08/autocomplete_by_your_own_hands
(6)http://www.pengoworks.com/workshop/jquery/autocomplete.htm
(7)http://huacn.blogbus.com/logs/19643985.html
试鼠标事g和键盘事件在IE和FF下的执行ơ序,同时试在中文输入法下的执行ơ序
<script>
function $(id){return document.getElementById(id);}
</script>
<input onmousedown="$('d').value=$('d').value+'down'" onmouseup="$('d').value=$('d').value+'up'"
onclick="$('d').value=$('d').value+'click'" ><br>
<input onkeydown="$('d').value=$('d').value+'down';" onkeyup="$('d').value=$('d').value+'up-'"
onkeypress="$('d').value=$('d').value+'press';"><br><br><br><br>
<input id='d' size=100>
你会(x)发现Q在非中文输入法模式?IE和FF大体上按下面的顺?br />(1)对key 来说 :keydown-->keypress-->keyupfunction $(id){return document.getElementById(id);}
</script>
<input onmousedown="$('d').value=$('d').value+'down'" onmouseup="$('d').value=$('d').value+'up'"
onclick="$('d').value=$('d').value+'click'" ><br>
<input onkeydown="$('d').value=$('d').value+'down';" onkeyup="$('d').value=$('d').value+'up-'"
onkeypress="$('d').value=$('d').value+'press';"><br><br><br><br>
<input id='d' size=100>
如果持箋按住键位,keydown?x)持l执?
如果要阻止按键的默认行ؓ(f),必须使用keypress(用return false),但按backspace时不?因ؓ(f)backspace时只执行keydown和keyup,keyup之前回退的效果已l生效了?br />(2)对mouse来说 :mousedown-->mouseup-->click ,在IE下如果在与按下鼠标的相同元素上松开则生click事g,如果村ּ时已l离开最初按下时的元素了Q则不会(x)产生click事g;但据我观察FF下不是这?FF下无论鼠标是否在最初的元素上松开Q都?x)生click事g?br />
在中文输入法模式?
(1)FF
其中downup-up-是输入法切换时的键盘事g
输入W一个字母时产生down-press事g,然后输入M字母都不?x)生键盘事? 只有按确认输入的键了Q例如按space或是1,才会(x)执行up事g,见右图?br />也就是说录入一ơ中文时Q不中间过E怎么P整个的键盘事件只??down-press-up
(?以上说的键盘事g都是指发生在input上的)
2,IE
其中downup-up-也是输入法切换时的键盘事?br />然后在输入法框里的所有按键都产生一对downup事g,包括回退和确认都是?br />无论光标在inputq是在输入法框按回退Q都是down-up
用style.imeMode好像无法得到当前text的输入法模式
(http://topic.csdn.net/t/20040908/13/3351801.html)
http://www.hihiyou.com/?p=5
http://realazy.org/blog/2007/10/31/solution-of-keyup-failing-when-ime-is-on/
http://topic.csdn.net/t/20040714/21/3175529.html
http://www.javaeye.com/topic/191555
?IE中onpropertychange时要用event.propertyName == "value"
document.getElementById('tt').attachEvent('onpropertychange',function(e){
for(var item in e){
alert(item+":"+e[item]);//遍历可看?/span>propertyName
}
});
for(var item in e){
alert(item+":"+e[item]);//遍历可看?/span>propertyName
}
});
判断表单里的元素的值有没有发生变化:
<script>
jQuery(document).ready(function(){
var inputarr =document.getElementsByTagName("INPUT");//TEXTAREA,SELECT{都可以q样?br /> for(var i=0;i<inputarr.length;i++){
inputarr[i].attachEvent('onpropertychange',function(e){
if(e.propertyName!='value')return; //不是value改变不执行后面的操作
else{ischanged=true}
});
}
});
</script>
奇怪的是先jQuery,再each,再用$(this).get(0).attachEvent("onpropertychange",fn); 好像不可?jQuery(document).ready(function(){
var inputarr =document.getElementsByTagName("INPUT");//TEXTAREA,SELECT{都可以q样?br /> for(var i=0;i<inputarr.length;i++){
inputarr[i].attachEvent('onpropertychange',function(e){
if(e.propertyName!='value')return; //不是value改变不执行后面的操作
else{ischanged=true}
});
}
});
</script>
q有
$("textarea").bind('propertychange',function(e) {
e.preventDefault();
// Your code here
});好像也不?br />
]]>
分两U，一U是l定事gQ带参，形如eventName(fn);
一U是触发事g,不带?形如eventName(),客户触发或者程序模拟触发?br /> 触发时包括了览器的默认行ؓ(f)?br /> 但可以通过在某个绑定的函数中返回false来防止触发浏览器的默认行为?br /> 在eventName(fn)的函C内，this 指代的是DOM对象而非jQuery对象.可用$(this)得到jquery对象
2,each(fn);
q回 'false' 停止@?(像在普通的循环中?'break')?br /> q回 'true' 跌下一个@?像在普通的循环中?continue')?br />
3,attr("checked", true)和attr("checked", '')是同L(fng)效果,但attr("checked", 'true')不行
4,
操作 radio
var item = $("input[name='items'][checked]").val();
$("input[name='items']").get(1).checked = true;
$("[name='isf'][value='yes']").attr("checked",true);
操作 select
var item = $("select[name='items'] option[selected]").text();
$('#select_id')[0].selectedIndex = 1;
5,属性选择?br /> [attribute] 匚w包含l定属性的元素
[attribute=value] 匚wl定的属性是某个特定值的元素
[attribute^=value] 匚wl定的属性是以某些值开始的元素
[attribute!=value] 匚wl定的属性是不包含某个特定值的元素
[attribute$=value] 匚wl定的属性是以某些值结元素
[attribute*=value] 匚wl定的属性是以包含某些值的元素
[selector1][selector2][selectorN] 复合属性选择器，需要同时满_个条件时使用?br /> 例如$("input[id][name$='man']")
6,$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]})
//实现表格的隔行换色效?/p>
7,$('input').one("click", function(){
alert($(this).val());
});
此事件执行一ơ即被删?br />
8,$("form input") 匚w所有的后代元素(子子孙孙)
$("form > input")匚w所有的子元?只有儿子)
$("div,span,p.myClass")每一个选择器匹配到的元素合q后一赯?br />
9,disabled的用?br />以下两种写法没有区别,都表CZ可用:
$("#btn").attr('disabled','false')?("#btn").attr('disabled','true')
可用的话要用:
$("#btn").removeAttr('disabled');?("#btn").attr('disabled', false);//注意无引?br />
10,mouseout的处?br />http://tangb4c.yo2.cn/archives/632854
http://www.zhangjingwei.com/show-93-1.html
http://bbs.51js.com/thread-70665-1-1.html
11Qjquery处理表格
http://blog.blueshop.com.tw/jeff377/archive/2008/02/01/54237.aspx
http://15daysofjquery.com/examples/zebra/
12 jQuery构造函数详?br />http://hi.baidu.com/xletian/blog/item/30810de92776be3bb90e2d69.html
13,jquery的布局理器layoutManager
14, 注意有空格和没空格的区别
var sel = $("#itemList [issel='true']");//itemList下所有含有issel='true'属性的子孙元素.好像用find{别的方式都实现不了?/p>
var sel = $("#itemList[issel='true']");//用issel='true'qo(h)前面的元?/p>
15,只读的写?/p>
jQuery(":input[name='title']").attr('readonly','readonly')
或jQuery(":input[name='title']")[0].readOnly=true
16Q重复复制同一个div
var tempDiv=jQuery('.cont').eq(0).clone();
jQuery('.cont').eq(jQuery('.cont').length-1).after(tempDiv);
17, id="org.id"时要转义:$("#org\\.id").val();
18Q?span style="color: rgb(128, 64, 64);">jQuery的serialize
可用来获取表单里元素的值拼成一个query string
19
jquery相关插g或项?br />(1)图表flot (http://code.google.com/p/flot/)
jqchart http://www.reach1to1.com/sandbox/jquery/jqchart/
ddrawing http://www.openstudio.fr/Library-for-simple-drawing-with.html
]]>
jQuery('div#intro').load('/some/fragment.html');
代码以GETh方式Q从/some/fragment.html文g中获取HTML片段Qƈ把片D装载到id="intro"的div中?br />
?
我第一ơ看到这行代码时Q几乎对它没什么印象。这看v来非常简z，但如果你想用jQuery做些更复杂的事情Q比如显CAjax装蝲q度Q该如何做呢Q?
jQueryZ准备了一些可自定义的事gQajaxStartQajaxCompleteQajaxError{等Q，来实C惌的代码。同?
jQuery也提供了q泛的底层APIQ来实现更复杂的Ajax交互Q?br />
jQuery.get('/some/script.php', {'name': 'Simon'}, function(data) {
alert('The server said: ' + data);
}); // 以GET方式通过/some/script.php?name=Simon获取数据
jQuery.post('/some/script.php', {'name': 'Simon'}, function(data) {
alert('The server said: ' + data);
}); // 以POST方式?some/script.php发送请?br />
jQuery.getJSON('/some.json', function(json) {
alert('JSON rocks: ' + json.foo + ' ' + json.bar);
}); // ?some.json接收q解析数据，把数据{换成JSON格式
jQuery.getScript('/script.js'); // 以GET方式获取/script.js脚本q用eval()执行
http://www.nixsky.com/program/java/2008-02/393.html
选取元素:
- jQuery('div.panel')
- 选取了所有class="panel"的div
- jQuery('p#intro')
- 选取了所有id="intro"的段?/span>
- jQuery('div#content a:visible')
- 选取了id="content"的div中所有可见的链接
- jQuery('input[@name=email]')
- 选取了所有name="email"的输入域
- jQuery('table.orders tr:odd')
- 选取了类名ؓ(f)“orders”的表中所有的奇数?br />
- jQuery('a[@href^="http://"]')
- 选取了所有（以http://开头的Q外部链?/span>
- jQuery('p[a]')
- 选取了所有包含一个或多个链接的段?br />
上述例子中，:visible?odd是jQuery实现的扩?很具特色。而属性的选取使用@作ؓ(f)标记Q?/span>
其方式和XPath一P要优于CSS2?br />
jQuery的这套选取语法包罗万象Q有些类似正则表辑ּQ想完全消化是需要花上一D|间的?/p>$(window.frames["innerIframe"].document).find("a[rel='external']").addClass("external")
.click(function(){window.open(this.href);return false;});});
在父H口中操?选中IFRAME中的所有单选钮
$(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");
在IFRAME中操?选中父窗口中的所有单选钮
$(window.parent.document).find("input[@type='radio']").attr("checked","true");
取消全?br /> $("input[@type=checkbox][@checked]").each(function(){
$(this).attr("checked", '');
});
如果选中的只有一个，取得选中的?br />$("input[@type=checkbox][@checked]").eq(0).val()
]]>
2,append(html) append(elem) append(elems)
指定的元素插入到某元素内部的末位|?br /> appendTo与之相反,但似乎只能用appendTo(elem)
3,prepend (html) prepend (elem) prepend (elems)
指定的元素插入到某元素内部的开始位|，注意与append的区?br />
4,wrap(htm)
匹配对象包含在l出的html代码?br />
5,next
<script type="text/javascript">
$(document).ready(function() {
$('#t').find('dd').end().find('dt').click(function() {
$(this).next().css("background","#f00");
});
});
</script>
<dl id="t">
<dt>点这里测?Q?lt;/dt>
<dd>1111111111111111</dd>
<dt>点这里测??</dt>
<dd>2222222222222222</dd>
</dl>
http://tzangms.com/blog/programming/984
http://www.tkk7.com/wangxinsh55/archive/2007/06/25/126166.html
6,深度Q递归式的 .extend()
新的extend()允许你更深度的合q套对象。下面的例子是一个很好的证明?br /> // 以前?.extend()
jQuery.extend(
{ name: “John? location: { city: “Boston?} },
{ last: “Resig? location: { state: “MA?} }
);
// l果:
// => { name: “John? last: “Resig? location: { state: “MA?} }
// 新的更深入的 .extend()
jQuery.extend( true,
{ name: “John? location: { city: “Boston?} },
{ last: “Resig? location: { state: “MA?} }
);
// l果
// => { name: “John? last: “Resig?
// location: { city: “Boston? state: “MA?} }
7,1.2.3版本?.2.1版本的removeҎ(gu)的区?br />1.2.1版本
remove: function(a){
if ( !a || jQuery.filter( a, [this] ).r.length ) {
jQuery.removeData( this );
this.parentNode.removeChild( this );
}
},
1.2.3版本remove: function( selector ) {
if ( !selector || jQuery.filter( selector, [ this ] ).r.length ) {
// Prevent memory leaks
jQuery( "*", this ).add(this).each(function(){
jQuery.event.remove(this);
jQuery.removeData(this);
});
if (this.parentNode)
this.parentNode.removeChild( this );
}
}
?a >http://www.blog.edu.cn/user2/50271/archives/2007/1963499.shtml
http://pyrolupus.com/demo/jqremovebug.php
http://dev.jquery.com/changeset/3790
8, extend()使用详解(不考虑深度的extend)
$.extend(target, prop1, propN)
用一个或多个其他对象来扩展一个对?即第一个参?Q返回这个最初的、ƈ且被修改q的对象。这是简单的实现l承的一大方?
- target (Object): 要扩展的对象
- prop1 (Object): 要与W一个对象合q的对象
- propN (Object): (可? 更多要与W一个对象合q的对象
合ƈdefaults和options, 但不修改defaultsQ返回合q后的对?br />var defaults = { validate: false, limit: 5, name: "foo" };
var options = { validate: true, name: "bar" };
var settings = jQuery.extend({}, defaults, options);
l果 :settings == { validate: true, limit: 5, name: "bar" },defaults没有被修?/font>
]]>
$(document.getElementById("msg"))
JQuery对象转成DOM对象则较复杂一些。由于JQuery对象本n也是集合Q所以必通过索引的方式来转成DOM对象。例如：(x)
$("#msg")[0]
$("div").eq(1)[0] $("div").get(0) $("td")[5]2,JQuery的getҎ(gu)和eqҎ(gu)的区?br /> eqq回的是jquery对象Q?br /> get(n)和烦引返回的是dom元素对象?br /> $("div").eq(2).html(); //调用jquery对象的方?/span>
$("div").get(2).innerHTML; //调用domҎ(gu)
3,在事件处理程序中如何得到事g的发?br />在事件处理程序中可以x一个event对象的方式来抓取事g的发?br />
$(document).ready(function(){
$("a.week").click(function(event){
var uri = "cWtc.do?";
var params = "action=blankWtc&wd=" + $(event.target).text();
window.location.href=uri + params;
});
});
$("a.week").click(function(event){
var uri = "cWtc.do?";
var params = "action=blankWtc&wd=" + $(event.target).text();
window.location.href=uri + params;
});
});
4QJavaScript只拥有单一的、全局的名U空_(d)即window对象Q，而很多程序员Q以及一些库Q恣意地Zd各种东西?br />要知道全局变量是魔|聪明的开发h员，?x)用类似组件模式的技术，来尽力减全局对象的数量?br />jQuery仅向全局名称I间引入一个标讎ͼ(x)jQuery函数/对象。其余的要么是jQuery的直接属性，要么是调用jQuery函数所q回的对象的Ҏ(gu)?br />5,两个select Q都是多选的Q要求一个按钮，点击时将list1中所有选中的项复制到l(f)ist2中，而且在list2中已l存在的就不再d
http://www.javaeye.com/topic/191788
function copy_onclick(){
$("#list1 option:selected").each(function () {
$(document.createElement("option"))
.attr("value",$(this).val())
.text($(this).val())
.appendTo('#list2:not(:has(option[value=\''+$(this).val()+'\']))');
}); }
6Q?br />http://space.flash8.net/space/?18713/action_viewspace_itemid_328089.html
http://hi.baidu.com/yandavid/blog/item/9f64c033dc623b40ac4b5fda.html
http://www.cssrain.cn/article.asp?id=235
http://www.shineblog.com/user6/mprogram/archives/2008/937200.shtml 框处?br />
John Resig 的主?a >http://ejohn.org/
Mike Hostetler?a >http://amountaintop.com/blog/mike
]]>