/*
@author: Terry
@params:
feedback - the selector for the element that gives the user feedback. Note that this will be relative to the form the plugin is run against.
hardLimit - whether to stop the user being able to keep adding characters. Defaults to true.
useInput - whether to look for a hidden input named 'maxlength' instead of the maxlength attribute. Defaults to false.
words - limit by characters or words, set this to true to limit by words. Defaults to false.
@license:
@version: 1.2
@changes: code tidy via Ariel Flesler and fix when pasting over limit and including \t or \n
*/ (function ($) { $.fn.maxlength = function (settings) { if (typeof settings == 'string') {
settings = { feedback : settings };
} settings = $.extend({}, $.fn.maxlength.defaults, settings); function length(el) {
var parts = el.value;
if ( settings.words )
parts = el.value.length ? parts.split(/\s+/) : { length : 0 };
return parts.length;
} return this.each(function () {
var field = this;
var $field = $(field);
var $form = $(field.form);
var limit = settings.useInput ? $form.find('input[name=maxlength]').val() : $field.attr('maxlength');
var $charsLeft = $form.find(settings.feedback); function limitCheck(event) {
var len = length(this);
var exceeded = len >= limit;
var code = event.keyCode;
if (!exceeded )
return; switch (code) {
case 8: // allow delete BackSpace BackSpace
case 9: // Tab Tab
case 17: // Next
case 36: // Home
case 35: // End
case 37: //
case 38: //Up Arrow
case 39: //Right Arrow
case 40: //Dw Arrow
case 46: //~
case 65: //A
return; default:
return settings.words && code != 32 && code != 13 && len == limit;
}
} var updateCount = function () {
var len = length(field);
var diff = limit - len; $charsLeft.html( diff || "0" ); // truncation code
if (settings.hardLimit && diff < 0) {
field.value = settings.words ?
// split by white space, capturing it in the result, then glue them back
field.value.split(/(\s+)/, (limit*2)-1).join('') :
field.value.substr(0, limit); updateCount();
}
};
$field.keyup(updateCount).change(updateCount);
if (settings.hardLimit) {
$field.keydown(limitCheck);
} updateCount();
});
}; $.fn.maxlength.defaults = {
useInput : false,
hardLimit : true,
feedback : '.charsLeft',
words : false
}; })(jQuery);

《JavaScript 源码分析》之 maxlength.js的更多相关文章

  1. angular源码分析:injector.js文件分析——angular中的依赖注入式如何实现的(续)

    昨天晚上写完angular源码分析:angular中jqLite的实现--你可以丢掉jQuery了,给今天定了一个题angular源码分析:injector.js文件,以及angular的加载流程,但 ...

  2. 《JavaScript 源码分析》之 jquery.unobtrusive-ajax.js

    /*! ** Unobtrusive Ajax support library for jQuery ** Copyright (C) Microsoft Corporation. All right ...

  3. LINQ to JavaScript 源码分析

    在.net平台工作一年有余,最喜欢的应属Linq特性 在几个移动端web小项目过程中,前端需要对json对象集合进行比较复杂的操作,为提高开发效率,引入了LINQ to Javascript,该项目地 ...

  4. angular源码分析:angular的整个加载流程

    在前面,我们讲了angular的目录结构.JQLite以及依赖注入的实现,在这一期中我们将重点分析angular的整个框架的加载流程. 一.从源代码的编译顺序开始 下面是我们在目录结构哪一期理出的an ...

  5. angular源码分析:angular中jqLite的实现——你可以丢掉jQuery了

    一.从function JQLite(element)函数开始. function JQLite(element) { if (element instanceof JQLite) { //情况1 r ...

  6. Vuex框架原理与源码分析

    Vuex是一个专为Vue服务,用于管理页面数据状态.提供统一数据操作的生态系统.它集中于MVC模式中的Model层,规定所有的数据操作必须通过 action - mutation - state ch ...

  7. Backbone.js源码分析(珍藏版)

    源码分析珍藏,方便下次阅读! // Backbone.js 0.9.2 // (c) 2010-2012 Jeremy Ashkenas, DocumentCloud Inc. // Backbone ...

  8. basket.js 源码分析

    basket.js 源码分析 一.前言 basket.js 可以用来加载js脚本并且保存到 LocalStorage 上,使我们可以更加精准地控制缓存,即使是在 http 缓存过期之后也可以使用.因此 ...

  9. JavaScript 模块化及 SeaJs 源码分析

    网页的结构越来越复杂,简直可以看做一个简单APP,如果还像以前那样把所有的代码都放到一个文件里面会有一些问题: 全局变量互相影响 JavaScript文件变大,影响加载速度 结构混乱.很难维护 和后端 ...

随机推荐

  1. 在 ML2 中配置 OVS flat network - 每天5分钟玩转 OpenStack(133)

    前面讨论了 OVS local network,今天开始学习 flat network. flat network 是不带 tag 的网络,宿主机的物理网卡通过网桥与 flat network 连接, ...

  2. .NET 串口通信

    这段时间做了一个和硬件设备通信的小项目,涉及到扫描头.输送线.称重机.贴标机等硬件.和各设备之间通信使用的是串口或网络(Socket)的方式.扫描头和贴标机使用的网络通信,输送线和称重机使用的是串口通 ...

  3. 关于微软HttpClient使用,避免踩坑

    最近公司对于WebApi的场景使用也越来越加大了,随之而来就是Api的客户端工具我们使用哪个?我们最常用的估计就是HttpClient,在微软类库中命名空间地址:System.Net.Http,是一个 ...

  4. 【原】FMDB源码阅读(二)

    [原]FMDB源码阅读(二) 本文转载请注明出处 -- polobymulberry-博客园 1. 前言 上一篇只是简单地过了一下FMDB一个简单例子的基本流程,并没有涉及到FMDB的所有方方面面,比 ...

  5. WPF 微信 MVVM

    公司的同事离职了,接下来的日子可能会忙碌,能完善DEMO的时间也会少了,因此,把做的简易DEMO整体先记录一下,等后续不断的完善. 参考两位大神的日志:WEB版微信协议部分功能分析.[完全开源]微信客 ...

  6. 前端学HTTP之安全HTTP

    前面的话 HTTP的主要不足包括通信使用明文(不加密),内容可能会被窃听:不验证通信方的身份,有可能遭遇伪装:无法证明报文的完整性,有可能被篡改 基本认证和摘要认证能够使得用户识别后较安全的访问服务器 ...

  7. 9、委托、事件、Lambda

    开始 关于委托,肯定是要有问题的. 第一个问题,委托用来干什么? 看.net中的表述:在.net平台下,委托类型用来定义和相应应用程序中的回调.(回调?处理内存中两个实体双向通信的一种技术.)   第 ...

  8. [原][Docker]特性与原理解析

    Docker特性与原理解析 文章假设你已经熟悉了Docker的基本命令和基本知识 首先看看Docker提供了哪些特性: 交互式Shell:Docker可以分配一个虚拟终端并关联到任何容器的标准输入上, ...

  9. MSYS2环境下编译X265

    HEVC(High Efficiency Video Coding),是一种新的视频压缩标准.可以替代H.264/ AVC编码,使得保持相同质量的情况下,体积减少40%左右.目前有多种实现版本,x26 ...

  10. Android 中的mvvm

    我们来了解一下MVVM模式与Databinding ,MVVM是一种模式,Databinding 是一种框架.DataBinding是一个实现数据和UI绑定的框架.而ViewModel和View可以通 ...