1、jQuery实现的内链接平滑滚动
不需要使用太复杂的插件，只要使用下载这段代码即可实现基于内部链接的平滑滚动

$('a[href^="#"]').bind('click.smoothscroll',function (e) {e.preventDefault(); var anchor = this.hash,$target = $(target); $('html, body').stop().animate({'scrollTop': $target.offset().top}, 500, 'swing', function () {window.location.hash = anchor;}); });

2、使用jQuery获取所有节点

var $element = $('#gbtags'); var $nodes = $element.contents(); $nodes.each(function() { if(this.nodeType === 3 && $.trim($(this).text())) { $(this).wrap(''); }});

3、限制选择框选择个数

$("#categories option").click(function(e){ if ($(this).parent().val().length < 2) { $(this).removeAttr("selected"); }});

4、jQuery使用通配符来删除class

var _c = 'your-icon-class' $('.currency').removeClass (function (index, css) { return (css.match (/\bicon-\S+/g) || []).join(' ');}).addClass('icon-'+_c);

5、切换启用和禁用

/* HTML||<input type="text" value="欢迎访问pleted', '"' + array1 + '"']); });});

8、超简单的密码强度提示

$('#pass').keyup(function (e) { var strongRegex = new RegExp("^(?=.{8,})(?=.*[A-Z])(?=.*[a-z])(?=.*[0-9])(?=.*\W).*$", "g"); var mediumRegex = new RegExp("^(?=.{7,})(((?=.*[A-Z])(?=.*[a-z]))|((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$", "g"); var enoughRegex = new RegExp("(?=.{6,}).*", "g"); if (false == enoughRegex.test($(this).val())) { $('#passstrength').html('More Characters'); } else if (strongRegex.test($(this).val())) { $('#passstrength').className = 'ok'; $('#passstrength').html('Strong!'); } else if (mediumRegex.test($(this).val())) { $('#passstrength').className = 'alert'; $('#passstrength').html('Medium!'); } else { $('#passstrength').className = 'error'; $('#passstrength').html('Weak!'); } return true;});

9、jQuery生成一个自动停靠页尾效果

// Window load event used just in case window height is dependant upon images$(window).bind("load", function () { var footerHeight = 0, footerTop = 0, $footer = $("#footer"); positionFooter(); function positionFooter() { footerHeight = $footer.height(); footerTop = ($(window).scrollTop() + $(window).height() - footerHeight) + "px"; if (($(document.body).height() + footerHeight) < $(window).height()) { $footer.css({ position: "absolute" }).stop().animate({ top: footerTop }); } else { $footer.css({ position: "static" }); } } $(window) .scroll(positionFooter) .resize(positionFooter);});

10、预防对表单进行多次提交

$(document).ready(function() { $('form').submit(function() { if(typeof jQuery.data(this, "disabledOnSubmit") == 'undefined') { jQuery.data(this, "disabledOnSubmit", { submited: true }); $('input[type=submit], input[type=button]', this).each(function() { $(this).attr("disabled", "disabled"); }); return true; } else { return false; } });});

11、图像等比例缩放

$(window).bind("load", function() { // IMAGE RESIZE $('#product_cat_list img').each(function() { var maxWidth = 120; var maxHeight = 120; var ratio = 0; var width = $(this).width(); var height = $(this).height(); if(width > maxWidth){ ratio = maxWidth / width; $(this).css("width", maxWidth); $(this).css("height", height * ratio); height = height * ratio; } var width = $(this).width(); var height = $(this).height(); if(height > maxHeight){ ratio = maxHeight / height; $(this).css("height", maxHeight); $(this).css("width", width * ratio); width = width * ratio; } }); //$("#contentpage img").show(); // IMAGE RESIZE});

12、鼠标滑动时的渐入和渐出

$(document).ready(function(){ $(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads $(".thumbs img").hover(function(){ $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover },function(){ $(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout });});

13、制作等高的列

var max_height = 0;$("div.col").each(function(){ if ($(this).height() > max_height) { max_height = $(this).height(); }});$("div.col").height(max_height);

14、图片预加载

(function($) { var cache = []; // Arguments are image paths relative to the current page. $.preLoadImages = function() { var args_len = arguments.length; for (var i = args_len; i--;) { var cacheImage = document.createElement('img'); cacheImage.src = arguments[i]; cache.push(cacheImage); } } jQuery.preLoadImages("image1.gif", "/path/to/image2.png");

15、获取 URL 中传递的参数

$.urlParam = function(name){ var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href); if (!results) { return 0; } return results[1] || 0;}

16、禁用表单的回车键提交

$("#form").keypress(function(e) { if (e.which == 13) { return false; }});

17、让整个DIV可以被点击

<div class = "myBox" > < a href = "https://" > < /a></div > $(".myBox").click(function(){ window.location=$(this).find("a").attr("href"); return false;});

18、在新窗口打开链接 (target=”blank”)

$('a[@rel$='external']').click(function(){ this.target = "_blank";});

大家可以结合之前小编整理的文章进行学习，把实用的jQuery代码片段进行汇总，以便日后学习使用。