1 元素屏幕居中

jQuery.fn.center = function () {
this.css("position","absolute");
this.css("top",($(window).height()-this.height())/2+$(window).scrollTop()+"px");
this.css("left",($(window).width()-this.width())/2+$(window).scrollLeft()+"px");
return this;
}
$("#myDiv").center();

2 获取页面路径相关参数

//值:http://42du.cn/list#jq
var url = document.URL;
//值:http:
var protocol = location.protocol;
//值:42du.cn
var host = location.host;
//值:jq
var hashP = document.URL.split('#')[1];

3 删除内联样式

$("*[style]").attr("style", "");

4 长度限制并截取

var $elem = $("#title");
if($elem.text().length > 30) {
$elem.text($elem.text().substr(0, 27)+"...");
}

5 外链新窗口打开

$("a[@href^='http']").attr('target','_blank');

6 测试JQuery与其它库冲突情况

//测试冲突代码
$("#jqtest").click( function() {
alert("jQuery is working!");
});
//避免冲突
var $jq = jQuery.noConflict();
$jq("#jqtest").click( function() {
alert("jQuery is working!");
});

7 加载JQuery即使CDN掉线

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/media/js/jquery.js"><\/script>')</script>

8 加载遮罩层,点击移除

$('<div id="overlay"></div>')
.css({
position : 'fixed',
top : 0,
left : 0,
right : 0,
bottom : 0,
opacity : 0.6,
background : 'black',
display : 'none'
})
.appendTo('body')
.fadeIn('normal')
.click(function () {
$(this).fadeOut('normal', function () {
$(this).remove();
})
});

9 元素固顶

//注意调整边界值
$(window).scroll(function() {
if ($(window).scrollTop() > 100) {
$('#navbar').css({'position' : 'fixed', 'top' : 0});
} else {
$('#navbar').css({'position' : 'relative', 'top' : 'none'});
}
});

10 禁止右键菜单

$(document).bind('contextmenu', function () {
return false;
})

11 对象插件模版代码

(function($){
var MyPlugin = function(element, options) {
var elem = $(element);
var obj = this;
var settings = $.extend({param: 'defaultValue'}, options || {});
// 公有方法
this.publicMethod = function(){
console.log('public method called!');
};
// 私有方法
var privateMethod = function() {
console.log('private method called!');
};
};
$.fn.myplugin = function(options) {
return this.each(function(){
var element = $(this);
// Return early if this element already has a plugin instance
if (element.data('myplugin')) return;
// pass options to plugin constructor
var myplugin = new MyPlugin(this, options);
// Store plugin object in this element's data
element.data('myplugin', myplugin);
});
};
})(jQuery);

 

很实用的JQuery代码片段(转)的更多相关文章

  1. 十条很实用的jQuery代码片段

    本文转自:http://developer.51cto.com/art/201604/509093.htm 作者:核子可乐译来源:51CTO 原文标题:10 jQuery Snippets for E ...

  2. 经验分享:10个简单实用的 jQuery 代码片段

    尽管各种 JavaScirpt 框架和库层出不穷,jQuery 仍然是 Web 前端开发中最常用的工具库.今天,向大家分享我觉得在网站开发中10个简单实用的 jQuery 代码片段. 您可能感兴趣的相 ...

  3. 10个简单实用的 jQuery 代码片段

    尽管各种 JavaScirpt 框架和库层出不穷,jQuery 仍然是 Web 前端开发中最常用的工具库. 今天,向大家分享我觉得在网站开发中10个简单实用的 jQuery 代码片段. 1.平滑滚动到 ...

  4. 一些实用的JQuery代码片段收集

    本文将展示50个非常实用的JQuery代码片段,这些代码能够给你的JavaScript项目提供帮助.其中的一些代码段是从jQuery1.4.2才开始支持的做法,另一些则是真正有用的函数或方法,他们能够 ...

  5. 12 个非常实用的 jQuery 代码片段

    jQuery是一个非常流行而且实用的JavaScript前端框架,本文并不是介绍jQuery的特效动画,而是分享一些平时积累的12个jQuery实用代码片段,希望对你有所帮助. 导航菜单背景切换效果 ...

  6. 几个非常实用的JQuery代码片段

    jQuery是一个兼容多浏览器的javascript库,核心理念是write less,do more(写得更少,做得更多).jQuery使用户能更方便地处理HTML(标准通用标记语言下的一个应用). ...

  7. js动态判断密码强度&&实用的 jQuery 代码片段

    // 网上拷贝的代码,效果不太好需要自己调整<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  8. 一些实用的JQuery代码片段收集(筛选,搜索,样式,清除默认值,多选等)

    //each遍历文本框 清空默认值 $(".maincenterul1").find("input,textarea").each(function () { ...

  9. 很棒的jQuery代码片段分享

    jQuery实现的内链接平滑滚动 不需要使用太复杂的插件,只要使用下载这段代码即可实现基于内部链接的平滑滚动 $('a[href^="#"]').bind('click.smoot ...

随机推荐

  1. cogs 服务点设置

    3. 服务点设置 ☆   输入文件:djsa.in   输出文件:djsa.out   简单对比时间限制:1 s   内存限制:128 MB 问题描述为了进一步普及九年义务教育,政府要在某乡镇建立一所 ...

  2. mysql实现full outer join

    由于MySQL设计时不支持full outer join, 所以如果有全连接需求时,需要一点小技巧来实现. 假设有两个表t1,t2 full outer join 的效果和下面的效果一样: SELEC ...

  3. [Codeforces 23D] Tetragon

    Brief Intro: 给3条相同长度的边的中点,问是否存在一个严格凸四边形 Algorithm: 明显只要求出一个点就能利用对称性算出其他点的坐标 设中点K,L,M分别在边AB,BC,CD上,易知 ...

  4. HDU 2819 Swap(二分图匹配)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=2819 [题目大意] 给出一个棋盘,由白格子和黑格子组成,可以交换棋盘的行列, 使得其主对角线为黑格 ...

  5. 【函数式权值分块】【分块】bzoj1901 Zju2112 Dynamic Rankings

    论某O(n*sqrt(n))的带修改区间k大值算法. 首先对序列分块,分成sqrt(n)块. 然后对权值分块,共维护sqrt(n)个权值分块,对于权值分块T[i],存储了序列分块的前i块的权值情况. ...

  6. [CF911B]Two Cakes

    题目大意: 有两种蛋糕,分别被切成了a块和b块,要把这些蛋糕分到n个盘子里. 要求每个盘子里只能有一种蛋糕,每一种蛋糕都被分.问最优情况下,盘子里至少能放几个蛋糕. 思路: 二分答案. 由于每个蛋糕都 ...

  7. [Markdown]纯文本标记语言MarkdowPad2--MD语法知识

    ##1.标题 代码 注:# 后面保持空格 # h1 ## h2 ### h3 #### h4 ##### h5 ###### h6 ####### h7 // 错误代码 ######## h8 // ...

  8. Java高级架构师(一)第26节:测试并调整登录的业务功能

    主Index的处理Java: package com.sishuok.architecture1; import org.springframework.beans.factory.annotatio ...

  9. Python自带的hmac模块

    Python自带的hmac模块实现了标准的Hmac算法 我们首先需要准备待计算的原始消息message,随机key,哈希算法,这里采用MD5,使用hmac的代码如下: import hmac mess ...

  10. Word中插入带公式的Visio注意事项

    有时候发现,有的公式显示的间距特别大,那么在word中右键打开Visio,改好后,保存了,word里还是那样. 因为你需要吧改好的另存为原来的visio文件(名字.位置要一样,就是说替换原来的文件), ...