zoukankan      html  css  js  c++  java
  • 文本框字符串长度实时统计jQuery插件,兼容IE6+

    效果如图:

    /*
     * ====== 字符串长度实时统计插件 =====
     *  author: Jim
     * version: 2.0 | 2013.12.18
     * =================================
    */

    ;(function($){ $.fn.extend({ // 回调函数在字符串长度统计完成后触发,this指向应用该插件的DOM元素,实参是统计得到的字符串长度; sumOfChars: function (options, callback) { var settings = $.extend({ eType: 'input', // 事件类型 (ps:测试发现'input'事件在IE9下使用退格键删减内容时竟然不能触发!) isByte: true // 统计的长度类型, true表示统计字节(一个汉字两个字节)长度; false表示统计字符长度; }, options || {}); // 当调用该插件时实参仅包含回调函数: typeof arguments[0] === 'function' && (callback = options); this.each(function(){ var self = $(this), type = settings.eType; // 'on'是jQuery 1.7+ 才有的方法 self.on(type, _handler).triggerHandler(type); type === 'input' && self.on('propertychange', function(){ // IE 8- // 如果发生改变的属性不是value就退出 if(!window.event || window.event.propertyName !== 'value') return; // 避免循环调用 $(this).off('propertychange', arguments.callee); _handler.apply(this); $(this).on('propertychange', arguments.callee); }).triggerHandler('propertychange'); }); // 长度统计 function _count (str, b) { return b? str.replace(/[^\x00-\xff]/g, "aa").length : str.length; } // 事件处理程序 function _handler (e) { var num = _count(this.value, settings.isByte); typeof callback === 'function' && callback.apply(this, [num]); } return this; // 返回jQuery对象以使其链式操作得以持续 } }); }(jQuery));

    使用示例:

    $('#textCont').sumOfChars( function(n){
    
        // 这里的this指向#textCont
        $('#showleng').text(n);
    
    } );
  • 相关阅读:
    ExecutorService与Executors例子的简单剖析
    java中线程队列BlockingQueue的用法
    mysql常用语句
    dubbo+zookeeper例子
    大型网站架构系列:消息队列(二)
    大型网站架构系列:分布式消息队列(一)
    什么是Code Review(转)
    Ehcache 整合Spring 使用页面、对象缓存
    java 多线程——quartz 定时调度的例子
    Dubbo与Zookeeper、SpringMVC整合和使用(负载均衡、容错)
  • 原文地址:https://www.cnblogs.com/MyNameIsJim/p/3475871.html
Copyright © 2011-2022 走看看