栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

jQuery-自动输入文字大小(不是textarea!)

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

jQuery-自动输入文字大小(不是textarea!)

这是一个插件,可以满足您的需求:

插件:

(function($){$.fn.autoGrowInput = function(o) {    o = $.extend({        maxWidth: 1000,        minWidth: 0,        comfortZone: 70    }, o);    this.filter('input:text').each(function(){        var minWidth = o.minWidth || $(this).width(), val = '', input = $(this), testSubject = $('<tester/>').css({     position: 'absolute',     top: -9999,     left: -9999,     width: 'auto',     fontSize: input.css('fontSize'),     fontFamily: input.css('fontFamily'),     fontWeight: input.css('fontWeight'),     letterSpacing: input.css('letterSpacing'),     whiteSpace: 'nowrap' }), check = function() {     if (val === (val = input.val())) {return;}     // Enter new content into testSubject     var escaped = val.replace(/&/g, '&amp;').replace(/s/g,' ').replace(/</g, '&lt;').replace(/>/g, '&gt;');     testSubject.html(escaped);     // Calculate new width + whether to change     var testerWidth = testSubject.width(),         newWidth = (testerWidth + o.comfortZone) >= minWidth ? testerWidth + o.comfortZone : minWidth,         currentWidth = input.width(),         isValidWidthChange = (newWidth < currentWidth && newWidth >= minWidth)        || (newWidth > minWidth && newWidth < o.maxWidth);     // Animate width     if (isValidWidthChange) {         input.width(newWidth);     } };        testSubject.insertAfter(input);        $(this).bind('keyup keydown blur update', check);    });    return this;};})(jQuery);


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/647620.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号