`

主题:50个令人惊奇的jQuery插件

 
阅读更多

jQuery拥有强大的有创造性的程序员群体。 然而,它很难通过在所有发布的东西里面挑出那些绝对必须要拥有的宝贝。在本文中,你将得到50个新jQuery插件和JavaScript库的一个集合,拥有好的工具,可以使您的网站更便于使用。这些插件分类展示,便于浏览。好好享受吧!

http://www.woiweb.net/50-amazing-jquery-plugins.html

其他篇

 

 

 

 

 

对话框

浏览器内置窗口便于使用但很难看而且不能定制化。如果你想要你的应用看起来更高端和专业,肯定有讨厌默认外观的地方,本章节中的插件可以替代内置对话框而且很容易定制化。

1. Alertify.js

Alertify (github) 是一个小巧的呈现漂亮对话框和通知的库。它很容易用CSS定制,拥有一个简单的API,不依赖第三方包。要用它,只要引入js文件并且调用全局alertify对象的方法:

1
2
3
4
5
6
7
8
9
10
11
// alert dialog
alertify.alert("Message");
 
// confirm dialog
alertify.confirm("Message", function (e) {
    if (e) {
        // user clicked "ok"
    } else {
        // user clicked "cancel"
    }
});

Alertify.js

2. jQuery Avgrund

jQuery Avgrund (github) 是另一个酷的对话框解决方案。它不如alertify特性丰富,事实上是你web应用所需要的,该对话框会以一个给人以深刻印象的动画效果出现,同时闪烁和变暗背景。

jQuery Avgrund

表单

表单繁琐枯燥,每个人讨厌填充它们。甚至更大的问题是如果当前没有进行客户端验证我们将强制其进行二次输入。本章节中的插件尝试用有用的功能来提高表单交互使事情变得更好些。

3. iCheck

iCheck (github) 是一个提高你的表单控制的jQuery插件。它完美定制化,可工作在移动端而且皮肤漂亮多样。要使用它,需要在你的页面引入js和css文件,用少许jQuery代码转换你所有的单选框和多选框。编者推荐使用。

1
2
3
4
5
6
$(document).ready(function(){
    $('input').iCheck({
        checkboxClass: 'icheckbox_minimal',
        radioClass: 'iradio_minimal'
    });
});

iCheck

iCheck

4. Long Press

Long Press 是一个jQuery插件,简化强调或生僻字的拼写,当打字时一直按着一个键将会出现一个你可以用来选择字符的工具条,该插件同样在github 上。译者注:这个挺不错。

Long Press

Long Press

5. jQuery File Upload

jQuery File Upload (github) 是一个集文件多选,拖拽,进度条和图片预览的组件。它支持跨域,分块且可恢复文件上传和客户端图片尺寸重置。可配合任何服务器端平台 (PHP, Python, Ruby on Rails, Java, Node.js等)而且其一系列的引用和回调使用其很容易嵌入到你的应用里面。

jQuery File Upload

jQuery File Upload

6. Complexify

Complexify (github) 是一个以评估密码复杂程序为目的的jQuery插件。你可以在注册表单中使用它来向用户展现密码复杂度的百分比(就像我们在本教程中所做)。有了这个插 件,你可以强制密码包含大写/小写字母,数字,特殊符号和更多的组合。我要指出,这是一个纯粹的客户端解决方案,这意味着它可以规避。这就是为什么你要在 服务器端还应检查密码的复杂性。

Complexify

Complexify

7. jQuery Knob

jQuery Knob (github) 是一个用于将输入元素转换为可触摸的jQuery转盘的插件。它使用canvas构建,并且通过设置输入框的属性值实现完全定制化。像这样:

<iframe id="aswift_3" style="left: 0px; top: 0px; position: absolute;" name="aswift_3" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" width="336" height="280"></iframe>
1
<input class="knob" data-width="150" data-cursor=true data-fgColor="#222222"data-thickness="0.3" value="29">

这转盘可以用鼠标(点击,拖拽,滚轮),键盘,或者在移动设备上使用触摸来控制。这个有点意思。

jQuery Knob

jQuery Knob

8. Pickadate.js

Pickadate.js (github) 是一个用于创建响应式并且移动端也很友好的日期选择jQuery插件,它使用非常简单并且能用CSS定制化,使用它,只需引入js文件和样式表,并在你的输入框上调用这个插件:

$('.datepicker').pickadate();

该插件有很多选项,请看 文档译者注:月份及年份带下拉的好像没做事件阻止,选择某个月会直接关掉当前选择器。

Pickadate.js

Pickadate.js

9. Chosen

Chosen (github) 是一个强大的组件,能将一个选择输入框转换成一个可检索的下拉列表。它易于用CSS定制,并且你可以在自己的代码通过回调函数来使用。该插件同样更新原始元素(隐藏的那个),如此可以它做为表单的一部分提交或用JS读取它也可得到正确的结果。译者注:这个真心不错。

Chosen

Chosen

10. Fancy Input

Fancy Input (github)是一个在超级酷的文本框中输入或删除文本的插件,它有5种动画效果,动画是用CSS3来实现效果。译者注:效果很棒,在输入中文时有不太好用。

$('div :input').fancyInput();

Fancy Input

Fancy Input

11. Typeahead.js

Typeahead (github) 是twitter的一个快速自动完成库。它的灵感来源于twitter.com的搜索框并且拥有其全部特性。当用户输入时它产生联想,并且将最顶部的联想做为输入提示,该插件可使用硬编码数据同样也支持远程数据,以此来减轻网络请求。

Typeahead.js

Typeahead.js

12. Parsley.js

Parsley.js (github) 是一个不显眼的表单验证库。它可以让你而无需编写一行JavaScript代码来验证表单字段。相反,你必须把数据属性置于你需要验证的输入框中,剩下的交由插件处理,该插件可同jQuery和Zepto一起工作,并且不到800行。

Parsley.js

Parsley.js

分享到:
评论

相关推荐

    jQuery插件jQuery插件

    jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件

    jquery插件库大全(200个).zip

    jquery插件库大全(200个): jqueryQQ表情插件 jquery下拉菜单导航 jquery下拉菜单栏 jquery仿Windows系统选中图标效果 jquery仿京东商品详情页图片放大效果 jquery仿百度新闻焦点轮播 jquery分离布局模版 jquery...

    jquery 插件jquery 插件jquery 插件jquery 插件

    jquery 插件jquery 插件jquery 插件jquery 插件

    jquery插件库(jquery.treeview插件库)

    jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery.treeview插件库)jquery插件库(jquery....

    60个令人惊叹的jQuery插件

    60个令人惊叹的jQuery插件

    jQuery插件,jQuery插件

    jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件jQuery插件

    jquery插件特效WORD版

    资源名称:jquery插件特效 WORD版内容简介:本文档主要讲述的是jquery插件特效;jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。其宗旨是—写更少的代码,做更多的事情。jQuery 是一个快速的,简洁...

    50个jQuery插件

    一共50个jQuery插件打包: 3D樱花漫天飞舞 20种按钮效果 30款css3 loading加载动画效果 calendar css3-hoverButton20160128 DreamMsg excel excel导入 jQuery和CSS3动感手风琴多级列表树菜单 jquery手写签名插件 ...

    50个精彩JQuery插件案例

    50个精彩JQuery插件案例,帮你实现精彩页面对面

    JQuery插件:alert、confirm、prompt对话框插件

    JQuery插件:alert、confirm、prompt对话框插件

    jQuery的Cookie插件 cookies

    cookies 是一个强大的 jQuery 用来操作 Cookie 的插件。除了常见的操作 $.cookies.set( 'sessid', 'dh3tr62fghe' ); var sessid = $.cookies.get( 'sessid' ); $.cookies.del( 'sessid' ); if( $.cookies.test() ) ...

    jQuery第5天知识点:隐式迭代、链式编程、jQuery插件.7z

    jQuery第5天知识点:隐式迭代、链式编程、jQuery插件.7z

    simplePagination.js:一个简单的jQuery分页插件

    一个简单的jQuery分页插件和3个CSS主题。

    50个jquery插件介绍

    通过本文的介绍,你就会知道jquery都能做到什么。您可以根据实际需求选择适合自己的开发插件,很实用哦。

    jQuery插件之二:Simple Tree

    jQuery插件之二:Simple Tree jQuery插件之二:Simple Tree jQuery插件之二:Simple Tree

    50个jQuery插件实用图例

    50个jQuery插件实用图例包括 页面导航,Tooltip气泡悬浮框等

    eclipse插件 - jQuery

    我们在编写js的时候,如果采用了jquery框架,当然很希望Eclipse能帮我们完成代码自动完成的功能了,但Eclipse默认只是支持js的代码自动完成,利用这个插件,可以让Eclipse支持jquery的代码自动完成功能(前提:...

    sublime2 jquery插件

    sublime2 jquery插件 快捷键:Ctrl + Shift + P,然后输入jQuery,哈哈支持jquery语法高亮显示喽!

    jquery 插件集合

    jquery 及其插件集合 包含 AddTxtToCaret:添加文本到光标位置 jquery.colorbox:完美的jquery弹出层支持图片播放 jquery.contextmenu.r2:jquery右键菜单 ...jquery-ui-1.8.16.custom.min:jquery UI插件

    jquery插件大全--打包下载

    jquery插件大全--打包下载 jquery插件大全--打包下载 jquery插件大全--打包下载 jquery插件大全--打包下载

Global site tag (gtag.js) - Google Analytics