分享五个有用的jquery小技巧

下文里技巧实现的效果虽然并不新鲜，但通过jQuery的封装，HTML实现了很大的清洁。清爽简洁又高效的代码任何时候都是开发者所醉心追求的终极目标，也许它简单，但是它能量巨大。一起来看看我们小编推荐给大家的五个非常实用的jQuery技巧。

1.禁用鼠标右键

$(document).ready(function() {
  $(document).bind("contextmenu", function(e) {
    return false;
  });
});

当然jquery1.7版本以后bind()函数推荐用on()来代替。

2.让内容闪烁起来

$.fn.flash = function(color, duration) {
  var current = this.css('color');
  this.animate( {color: 'rgb(' + color + ')'}, duration / 2);
  this.animate( {color: current}, duration / 2);
}
$('#someid').flash('255,0,0', 1000);

3.DOM加载完成的简写形式

$(function() {
  // document is ready..
})

4.探测浏览器

// Safari
if( $.browser.safari )
{
//do something
}
//Above IE6
if ($.browser.msie && $.browser.version > 6 )
{
//do something
}
// IE6 and below
if ($.browser.msie && $.browser.version < 6 ) { //do something } // Firefox 2 and above if ($.browser.mozilla && $.browser.version >= "1.8" )
{
//do something
}

5.判断元素是否存在

if($("#someDiv").length) {
  // yes it does, do something...
}

以上跟大家分享了五个有用的jquery小技巧，希望大家喜欢。

赞 (0)

相关推荐

  • 七个不允许错过的jQuery小技巧

    七个不允许错过的jQuery小技巧

    jQuery是一款轻量级的JavaScript库,是最流行的客户端HTML脚本之一,它在WEB设计师和开发者中非常的有名,并且有非常多有用的插件和技术. 本文我们将为大家分享一些jQuery小技巧: 一.在新窗口打开链接 用下面的代码,你点击链接即可在新窗口打开: $(document).ready(function() { //select all anchor tags that have http in the href //and apply the target=_blank $("a

  • Jquery下的26个实用小技巧(jQuery tips, tricks & solutions)

    比如有禁止右键点击.隐藏搜索文本框文字.在新窗口中打开链接.检测浏览器.预加载图片.页面样式切换.所有列等高.动态控制页面字体大小.获得鼠标指针的X值Y值.验证元素是否为空.替换元素.延迟加载.验证元素是否存在于Jquery集合中.使DIV可点击.克隆对象.使元素居中.计算元素个数.使用Google主机上的Jquery类库.禁用Jquery效果.解决Jquery类库与其他Javascript类库冲突问题. 具体如下: 1. 禁止右键点击 复制代码 代码如下: $(document).ready(

  • Jquery使用小技巧汇总

    下面列出了一些Jquery使用技巧.比如有禁止右键点击.隐藏搜索文本框文字.在新窗口中打开链接.检测浏览器.预加载图片.页面样式切换.所有列等高.动态控制页面字体大小.获得鼠标指针的X值Y值.验证元素是否为空.替换元素.延迟加载.验证元素是否存在于Jquery集合中.使DIV可点击.克隆对象.使元素居中.计算元素个数.使用Google主机上的Jquery类库.禁用Jquery效果.解决Jquery类库与其他Javascript类库冲突问题. 1. 禁止右键点击 $(document).ready

  • 几个比较经典常用的jQuery小技巧

    几个比较经典常用的jQuery小技巧

    > 唔,这个主题挂的时间也够长的了,也该换换了,到时候找找看有没有合胃口的主题. > 话说,最近有点偏向 PHP 去了,我发现贪多嚼不烂,所以就又回到主题咯,(*^__^*) 嘻嘻. 1. Jquery 库的调用: > 呵呵,相信很多童鞋早就会了,不过还是得提一下,忘记就杯具咯. > 第一个是常用的 Google 托管处的 jQuery 库地址. > 而第二个则是 jQuery 官方网站的库地址,随时获取最新版,嘿嘿. 复制代码 代码如下: <script src=&q

  • 分享15个大家都熟知的jquery小技巧

    帮助提高你jQuery应用的15个大家都熟知的jquery小技巧,分享给大家 回到顶部按钮 图片预加载 判断图片是否加载完 自动修补破损图像 Hover切换class类 禁用输入 停止正在加载的链接 toggle fade/slide 简单的手风琴 使两个DIV同等高度 在浏览器标签/新窗口打开外部链接 根据文本获取元素 可见变化的触发 Ajax调用错误处理 链式操作 1.回到顶部按钮 利用jQuery里的animate和scrollTop方法,你便不需要使用插件创建简单的滚动到顶部动画. //

  • jQuery提交多个表单的小技巧

    <script type="text/javascript"> $(function(){ $("#btnSubmit").click(function(){ $("form[name='form1']").submit(); $("form[name='form2']").submit(); }) }) </script> <form name = "form1" actio

  • jquery操作复选框(checkbox)的12个小技巧总结

    1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$("input:[type='checkbox']:checked").val();或者$("input:[name='ck']:checked").val(); 2. 获取多个checkbox选中项$('input:checkbox').each(function() {        if ($(this).attr('che

  • 15个jquery常用方法、小技巧分享

    1.获取td的行标和列标 复制代码 代码如下: $(this).prop('cellIndex') 2.判断是否是回车按下 复制代码 代码如下: var myEvent = event || window.event;  var key = myEvent.keyCode;  if(key == 13){     //此时为回车按下          } 3.全选和反选 复制代码 代码如下: $("#selectall").click(function(){     if($(&quo

  • 分享五个有用的jquery小技巧

    下文里技巧实现的效果虽然并不新鲜,但通过jQuery的封装,HTML实现了很大的清洁.清爽简洁又高效的代码任何时候都是开发者所醉心追求的终极目标,也许它简单,但是它能量巨大.一起来看看我们小编推荐给大家的五个非常实用的jQuery技巧. 1.禁用鼠标右键 $(document).ready(function() { $(document).bind("contextmenu", function(e) { return false; }); }); 当然jquery1.7版本以后bin

  • 分享五个PHP7性能优化提升技巧

    分享五个PHP7性能优化提升技巧

    PHP7已经发布了, 作为PHP10年来最大的版本升级, 最大的性能升级, PHP7在多放的测试中都表现出很明显的性能提升, 然而, 为了让它能发挥出最大的性能, 我还是有几件事想提醒下. 1. Opcache 记得启用Zend Opcache, 因为PHP7即使不启用Opcache速度也比PHP-5.6启用了Opcache快, 所以之前测试时期就发生了有人一直没有启用Opcache的事情. 启用Opcache非常简单, 在php.ini配置文件中加入: zend_extension=opcac

  • WEB前端开发都应知道的jquery小技巧及jquery三个简写

    一个简单技巧的集合,帮你提升 jQuery 技能.目前小编给大家整理了14个jquery小技巧. 目录结构 1回到顶部按钮 2预加载图片 3检查图片是否加载完毕 4自动修复损坏的图片 5Hover 上的 Class 开关 6禁用 input 字段 7停止链接加载 8淡入淡出/滑动开关 9简单的折叠效果 10将两个 Div 设为相同高度 11在新窗口打开外部链接 12找到文本元素 13切换可视与隐藏的触发器 下面给大家介绍每个小技巧的具体含义. 1.回到顶部按钮 通过使用 jQuery 中的 an

  • 分享常用的3个C++小技巧

    目录 1.头文件是引用<iostream.h>还是<iostream>? 2.逗号分割表达式 3.在main函数之前运行代码 1.头文件是引用<iostream.h>还是<iostream>? 编码中依旧有程序员依旧使用<iostream.h>而不是<iostream>库.实际上,这两个库是有区别的: 首先针对用.h作为标准头文件已经明确不推荐使用. 其次,在功能方面,<iostream>包括IO类,且同时支持窄字符和宽字

  • 分享一些非常实用的Python小技巧

    目录 1.唯一性 2.变位词(相同字母异序词) 3.内存 4.字节大小 5.打印N次字符串 6.首字母大写 7.列表细分 8.压缩 9.计数 10.链式比较 11.逗号分隔 12.元音计数 13.首字母小写 14.展开列表 15.寻找差异 16.输出差异 17.链式函数调用 18. 19.将两个列表转换为字库 20.出现频率最高的元素 21.回文(正反读有一样的字符串) 22.不用if-else语句的计算器 23.随机排序 24.展开列表 1.唯一性 以下方法可以检查给定列表是否有重复的地方,可

  • 分享python数据统计的一些小技巧

    最近在用python做数据统计,这里总结了一些最近使用时查找和总结的一些小技巧,希望能帮助在做这方面时的一些童鞋.有些技巧是很平常的用法,平时我们没有注意,但是在特定场景,这些小方法还是能带来很大的帮助. 1.在字典中将键映射到多个值上面 {'b': [4, 5, 6], 'a': [1, 2, 3]} 有时候我们在统计相同key值的时候,希望把所有相同key的条目添加到以key为键的一个字典中,然后再进行各种操作,这时候我们就可以使用下面的代码进行操作: from collections im

  • 前端开发必知的15个jQuery小技巧

    下面这些简单的小技巧能够帮助你玩转jQuery. 1.返回顶部按钮 通过使用jQuery中的animate 和scrollTop 方法,不用插件就可以创建一个滚动到顶部的简单动画: // Back to top $('.top').click(function (e) { e.preventDefault(); $('html, body').animate({scrollTop: 0}, 800); }); <!-- Create an anchor tag --> <a class=

  • 分享7个杀手级JS小技巧

    目录 一.数组乱序 二.复制到剪贴板 三.数组去重 四.检测黑暗模式 五.滚动到顶部 六.滚动到底部 七.生成随机颜色 一.数组乱序 在使用需要某种程度的随机化的算法时,你会经常发现洗牌数组是一个相当必要的技能.下面的片段以O(n log n)的复杂度对一个数组进行就地洗牌. const shuffleArray = (arr) => arr.sort(() => Math.random() - 0.5) // 测试 const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9

随机推荐