实用jQuery代码片段

maco精选的一些jQuery代码，也许你从中可以举一反三
[代码] [JavaScript]代码
001<p>
002    <h3><span >★ 使用jQuery来切换样式表</h3>
003    <pre class="brush:js">$("link[media='screen']").attr("href", "Alternative.css");</pre>
004</p>
005 
006<p>
007    <h3><span >★ jQuery检测浏览器类型</h3>
008    <pre class="brush:js">
009        (if( $.browser.safari))
010        (if ($.browser.msie && $.browser.version > 6 ))
011        (if ($.browser.msie && $.browser.version <= 6 ))
012        (if ($.browser.mozilla && $.browser.version >= '1.8' ))
013    </pre>
014</p>
015 
016<p>
017    <h3><span >★ jQuery验证某个元素是否为空</h3>
018    <pre class="brush:js">
019        if ($("#Demo").html()) { //null;}
020    </pre>
021</p>
022 
023<p>
024    <h3><span >★ jQuery从集合中获得索引值</h3>
025    <pre class="brush:js">
026        $("ul > li").click(function () {
027            var index = $(this).prevAll().length;
028        });
029    </pre>
030</p>
031 
032<p>
033    <h3><span >★ jQuery选择被选中的option元素</h3>
034    <pre class="brush:js">
035        $("#someElement").find("option:selected");
036    </pre>
037</p>
038 
039<p>
040    <h3><span >★ jQuery为选择器绑定方法</h3>
041    <pre class="brush:js">
042        $("table").delegate("td", "hover", function(){
043            $(this).toggleClass("hover");
044        });    //1.42版后,delegate替代live,因为它们提供了更好的上下文支持
045    </pre>
046</p>
047 
048<p>
049    <h3><span >★ jQuery自动滚动到页面中的某区域(可以看做一个小插件)</h3>
050    <pre class="brush:js">
051        jQuery.fn.Autoscroll = function(sel) {
052            $('html,body').animate(
053                {scrollTop: $(sel).offset().top},500
054            );
055        }      //调用：$("#area_name").Autoscroll();
056    </pre>
057</p>
058 
059<p>
060    <h3><span >★ jQuery限制"TextArea"域中的字符数(可以看做一个小插件)</h3>
061    <pre class="brush:js">
062         (function($) {
063        jQuery.fn.maxLength = function(max){
064                this.each(function(){
065                var type = this.tagName.toLowerCase();
066                var inputType = this.type ? this.type.toLowerCase() : null;    
067                if (type == "input" && inputType == "text" || inputType == "password") {
068                    //应用标准的maxLength
069                    this.maxLength = max;
070                }
071                else
072                    if (type == "textarea") {
073                        this.onkeypress = function(e){
074                            var ob = e || event;
075                            var keyCode = ob.keyCode;
076                            var hasSelection = document.selection ? document.selection.createRange().text.length > 0 : this.selectionStart != this.selectionEnd;
077                           return !(this.value.length >= max && (keyCode > 50 || keyCode == 32 || keyCode == 0 || keyCode == 13) && !ob.ctrlKey && !ob.altKey && !hasSelection);
078                        };
079                        this.onkeyup = function(){
080                            if (this.value.length > max) {
081                                this.value = this.value.substring(0, max);
082                            }
083                        };
084                    }
085            });
086        })(jQuery);  //调用：$('#macoArea").maxLength(500);
087    </pre>
088</p>
089 
090<p>
091    <h3><span >★ jQuery判断某个元素是否可见</h3>
092    <pre class="brush:js">
093        if($("#macoArea").is(":visible") == "true") { //少年,别跑 }
094   </pre>
095</p>
096 
097<p>
098    <h3><span >★ jQuery元素居中显示(可以看做一个小插件)</h3>
099    <pre class="brush:js">
100        (function($) {
101            jQuery.fn.center = function () {
102                this.css('position','absolute');
103                 this.css('top', ( $(window).height() - this.height() ) / +$(window).scrollTop() + 'px');
104                 this.css('left', ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + 'px');
105                 return this;
106            }
107        })(jQuery);  //调用：$("#macoArea").center();
108    </pre>
109</p>
110 
111<p>
112    <h3><span >★ jQuery使用.siblings()选择同辈元素</h3>
113    <pre class="brush:js">
114        // 少年,你是否这样操作过
115        $('#nav li').click(function(){
116            $("#macoArea li").removeClass("current");
117            $(this).addClass("current");
118        });网站源码下载
119        //这样做是不是会更好呢
120        $("#nav li").click(function(){
121            $(this).addClass("current").siblings().removeClass("current");
122        });
123    </pre>
124</p>
125 
126<p>
127    <h3><span >★ jQuery操作复选框全选反选</h3>
128    <pre class="brush:js">
129       var sta = false; //你懂,全局东东
130        $('a').click(function() {
131            $("input[type=checkbox]").attr("checked",!sta);
132            sta = !sta;
133        });
134    </pre>
135</p>
136 
137<p>
138   <h3><span >★ jQuery获得鼠标光标位置x和y</h3>
139    <pre class="brush:js">http://www.huiyi8.com/jiaoben/
140        $(document).mousemove(function(e)}
141            $(document).ready(function() {
142                $().mousemove(function(e){
143                $("#macoArea").html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
144            });
145        });
146    </pre>
147</p>
148 
149<p>
150    <h3><span >★ jQuery解析XML</h3>
151    <pre class="brush:js">
152        function ParseXml(xml) {
153            $(xml).find("Node").each(function(){
154                $("#macoArea").append($(this).attr("Author") + "");
155            );
156        }
157    </pre>
158</p>
159 
160<p>
161    <h3><span >★ jQuery判断图像是否被完全加载进来</h3>
162    <pre class="brush:js">
163        $('#demoImg').attr("src", "demo.jpg").load(function() {
164            alert("是的,你看到的是真的");
165        });
166    </pre>
167</p>
168 
169<p>
170    <h3><span >★ jQuery让Cookie过期</h3>
171    <pre class="brush:js">
172        var date = new Date();
173        date.setTime(date.getTime() + (x * 60 * 1000));
174        $.cookie("example", "foo", { expires: date });;
175    </pre>
176</p>
177 
178<p>
179    <h3><span >★ jQuery禁止鼠标右键</h3>
180    <pre class="brush:js">
181        $(function(){
182            $(document).bind("contextmenu",function(e){
183                return false;
184            });
185        });
186    </pre>
187</p>