jQuery是当今最流行Web开发必备javascript库。本文收集了18个很棒的jQuery代码片段,希望这些代码片段能对大家有帮助。
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;
});
});
使用jQuery获取所有节点var $element = $('#gbtags');
var $nodes = $element.contents();
$nodes.each(function() {
if(this.nodeType === 3 && $.trim($(this).text())) {
$(this).wrap('');
}
});
限制选择框选择个数$("#categories option").click(function(e){
if ($(this).parent().val().length < 2) {
$(this).removeAttr("selected");
}
});
jQuery使用通配符来删除classvar _c = 'your-icon-class'
$('.currency').removeClass (function (index, css) {
return (css.match (/bicon-S+/g) || []).join(' ');
}).addClass('icon-'+_c);
切换启用和禁用/* HTML
|
|
|
|
*/
// Plugin
(function ($) {
$.fn.toggleDisabled = function () {
return this.each(function () {
var $this = $(this);
if ($this.attr('disabled')) $this.removeAttr('disabled');
else $this.attr('disabled', 'disabled');
});
};
})(jQuery);
// TEST
$(function () {
$('input:button').click(function () {
$('input:text').toggleDisabled();
});
});
平滑滚动返回顶端admin10000.com
*/
制作等高的列
var max_height = 0;
$("div.col").each(function(){
if ($(this).height() > max_height) { max_height = $(this).height(); }
});
$("div.col").height(max_height);
图片预加载
(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");
获取 URL 中传递的参数
$.urlParam = function(name){
var results = new RegExp('[\?&]' + name + '=([^]*)').exec(window.location.href);
if (!results) { return 0; }
return results[1] || 0;
}
禁用表单的回车键提交
$("#form").keypress(function(e) {
if (e.which == 13) {
return false;
}
});