• 文本框字符串长度实时统计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);
    
    } );
  • 相关阅读:
    DFS搜索算法--(1)基础图遍历 绝对看!的!懂!
    C++;STL--队列与栈;
    Unity VR-播放demo模型后无法移动视角
    自律
    链表-简单练习题2-数据结构实验之链表二:逆序建立链表
    链表-简单练习题1-数据结构实验之链表一:顺序建立链表 SDUT2117
    链表--笔记
    leetcode--Binary Tree Maximum Path Sum
    leetcode--Single Number II
    leetcode--Single Number
  • 原文地址:https://www.cnblogs.com/MyNameIsJim/p/3475871.html
Copyright © 2020-2023  润新知