随笔分类 - jQuery
jQuery技术
摘要：日常项目中, 对于列表类文章或数据, 大概都会用到checkbox的全选或全不选的功能, 以前的项目中也写过checkbox的选择js, 但都没有整理过. 正好前几天一个兄弟遇到了这个问题, 索性, 我花了点时间, 用原生JS与jQuery分别写了一个版本, 考虑到使用时灵活性问题, 未封装, 需要的童鞋使用时自行改下相关参数.功能介绍点此查看DEMO1. 全选/全不选 选框一体实现, 即列表中选框的状态与全选/全不选框前的选框状态一致;2. 自动更改 全选/全不选 选框的状态, 即列表中选框都选中时, 全选/全不选 选框也选中, 反之亦然;3. 列表行内点击也可选中行内的checkbox,
阅读全文
摘要：jQuery核心中, 有一组队列控制方法, 这组方法由queue()/dequeue()/clearQueue()三个方法组成, 它对需要连续按序执行的函数的控制可以说是简明自如, 主要应用于animate ()方法, ajax以及其他要按时间顺序执行的事件中.先解释一下这组方法各自的含义.queue(name,[callback]): 当只传入一个参数时, 它返回并指向第一个匹配元素的队列(将...
阅读全文
摘要：jQuery的数组处理,便捷,功能齐全. 最近的项目中用到的比较多,深感实用,一步到位的封装了很多原生js数组不能企及的功能. 最近时间紧迫,今天抽了些时间回过头来看 jQuery中文文档 中对数组的介绍,顺便对jQuery数组做个总结.温故,知新.强烈建议你打开DEMO演示后再看下面的详解: 点此查看DEMO1. $.each(array, [callback]) 遍历[常用]解释: 不同于例遍...
阅读全文
摘要：选择标签至表单域插件, 基于jQuery, 可多选/可过滤重复/可限制个数. 是以前的项目中用到过的一个项目, 当初是用原生js东拼西凑的, 用jQuery重写了下,已封装成插件.暂时没有对手动输入的做判断, 需要的话, 可自行在keyup及change事件中添加相关判断.相关说明及调用方法,请参见代码中的注释.演示及代码:点此查看DEMO;(function(){ $.fn.extend({ i...
阅读全文
摘要：通过dl模拟实现SELECT下拉列表. 其实这是项目中要常用到的一个效果, 于是, 在之前写的基础上封装成了一个插件. 可自定义样式, 可防止用户本意划过时触发事件.具体思路就不说了,比较常规, 代码中也有注释. 使用方法也不费话了, 就是一个简单的全局函数封装, 不懂的看下源码中注释或Google.另外, 有兴趣的朋友,可以尝试在本插件基础上改一个可输入的下拉列表. 思路差不多,哈.演示及代码:...
阅读全文
摘要：最近在为项目写登录注册系列页面, 表单验证无疑是不可缺少的部分, 在这个jQ插件满天飞的web年代, 表单验证倒也不是难事. 但再好的插件, 也并不能做到十全十美, 比如这次用到的我先前介绍过的Vanadium表单验证插件, 因为是E文中不存在占2个字符的字, 所以, 区分中英文字符就得自己扩展. 本文就将介绍两种区分中英文字符的方法: 利用正则和charCodeAt方法区分中英文字符.点此查看D...
阅读全文
摘要：近几天折腾了个摄影页面, 记录平时拍的一些影像碎片, 修改Wordpress的Filkr相册插件嫌麻烦,于是所有图片的地址都是以静态形式写进去. 觉着很麻烦,特别是添加图片时.怎么办?我想到了强大的xml. 何不将所有的图片路径数据集中放在一个xml文档中,然后用JavaScript加载该文档,再把数据一条条插进去,这样就不用每次到页面中写html代码了(JSON可以更简洁的解析,但本文是讲xml...
阅读全文
摘要：比较常用的限制字符输入数功能(比如热火超天的微博输入框),用jQuery和原生JavaScript分别写了一个.原生JavaScript注释中有区分中英文字符的函数, 但个人并不建议这么做.已知BUG:Ubuntu系统下, onkeyup事件失效,详见: Ubuntu系统下onkeyup/onkeydown对中文输入失效bug.查看演示: 点此查看DEMO核心代码://原生JavaScript版...
阅读全文
摘要：此插件是对10年8月20日的文章的更新, 之前的版本有诸多bug...抱着对读者负责的态度,又重写了一次. 更新内容:1. 用户快速划过按钮时不触发鼠标事件;2. 鼠标划入当前图片按钮时不闪烁;3. 简化并优化代码.使用方法就不详述了, 请参见源码及相关注释:点此查看DEMO原文发布于Mr.Think的博客:http://mrthink.net/jq-plugin-ifadeslide/ 转载请注明
阅读全文
摘要：日常项目中常用到的,用jQuery和原生JS分别写了一个. 两种写法均实现了结构/表现/行为的完全分离.当然,稍作修改,可以在同一个页面中应用于多个选项卡.关于思路,和常规选项卡思路一样.点击选项菜单,突出显示,并显示对应的选项.本文实例中主要是通过判断点击菜单在菜单列表中的索引位置来显示或隐藏选项区.原生js还有很多种实现方法(蓝色理想中搜索),为了与jQ版思路保持一致,本文实例用的是循环判断....
阅读全文
摘要：基于jQuery的上下无缝滚动应用,可应用于多行或者单行.详解请参考注释.查看演示: 点此查看DEMO核心jQuery代码:$(function(){ var _wrap=$('ul.line');//定义滚动区域 var _interval=2000;//定义滚动间隙时间 var _moving;//需要清除的动画 _wrap.hover(function(){ clearInterval(_m...
阅读全文
摘要：可扩展的简易点击展开/关闭效果,分别用原生JavaScript和jQuery实现.使用方法及相关解释,请参见源码.另,授人以鱼,不如授人以渔.我写的只是一个原型,提供一个思路一种方法.注释中我也注明了,如果你想要酷炫的效果,你可以根据自己的实际需求扩展.查看演示: 点此查看DEMO原生JS版本:window.onload=function(){ vardivs=document.getEleme...
阅读全文
摘要：迷上jQuery,相对于原生JavaScript,它是如此的美妙.也因此,促使我更加的努力的研习原生JavaScript.分享一个控制左右滚动及自动滚动的样例, 昨晚花了两个多小时, 忍受着悍蚊的叮咬, 汗水的侵袭, 一行行的敲出来的血汗代码. 哈哈.封装了两种模式: 点击滚动版本DEMO自动滚动版本DEMO,源码中有详细注释.思路:点击滚动模式下,是为点击(向前/向后/数字)添加click事件,...
阅读全文
摘要：一款比较实用,并且验证类型齐全的jQuery表单验证插件.英文版原作者@Vanadium,由我做中文整理.E文水平有限,如果翻译的有问题的,请大家指出,在此感谢~ 可以验证哪些? 文字,日期,邮箱,网址,数字,AJAX用户名验证以及自定义的正则等等几乎所有我们要用到的验证.不多说,看DEMO吧: 点此查看DEMO 点此下载DEMO如何使用?第一步,当然是和使用其他jQuery插件一样,引入插件文件...
阅读全文
摘要：最近比较懒,啥都不想干.分享两个比较实用的基于jQuery的幻灯片吧. 注释写了一个,不想写了,另一个还是原作者的英文注释.非原创,由我改良,无从考证原作者,在此感谢.点此查看DEMO至于使用方法也就不写了(我声明了我最近比较懒,哈哈),比较简单,自己看DEMO修改吧.为了不浪费你点DEMO的力气,先上两张图,展示下静态的效果:好了,就这样吧,想用的话自己慢慢折腾吧.原文发布于Mr.Think的博...
阅读全文
摘要：据说,这是一个最近很流行的效果,新浪微博,腾讯微博,都用到了这种效果,本博开博时也追随潮流用上了这种效果,今天又在经典论坛中看到了这个效果.使用方法:在你的大图链接中加入class=”miniImg artZoom”例:<a class="miniImg artZoom" href="http://www.amostoys.com/images/460/graphic...
阅读全文
摘要：最近写了两个管理后台的前端页面,其中有一个管理后台,左侧菜单导航和右侧内容页是两个iframe,需求是,点击上面的主导航时,左侧iframe和右侧iframe调用不同的链接.个人推荐用jQuery实现,代码简洁,扩展性强.jQuery部分:function gotourl(url_a, url_b){ $('#ifr_a').get(0).src = url_a; $('#ifr_b').get(...
阅读全文