首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >文本区域自动增长功能在每次击键时都会出现抖动

文本区域自动增长功能在每次击键时都会出现抖动
EN

Stack Overflow用户
提问于 2009-11-07 10:20:44
回答 1查看 1.1K关注 0票数 0

我使用的是jquery自动增长插件,它可以根据文本的需要自动扩展文本的高度。问题是,每按下一个键,文本区域的底部边框就会以一种明显的方式抖动。我不确定问题是什么,所以我将冒险在这里发布这个GPL插件的132行代码。有没有任何提示问题可能在哪里,或者如何规避它?

代码语言:javascript
复制
         /* 

      Auto Expanding Text Area (1.2.2)  by Chrys Bader */

        (function(jQuery) {
           var self = null;     
           jQuery.fn.autogrow = function(o){
             return this.each(function() {  
                new jQuery.autogrow(this, o);
             });
           };


      /**
      * The autogrow object.
      *
      * @constructor
      * @name jQuery.autogrow
      * @param Object e The textarea to create the autogrow for.
      * @param Hash o A set of key/value pairs to set as configuration properties.
      * @cat Plugins/autogrow
      */        

     jQuery.autogrow = function (e, o) {
        this.options = o || {};         
        this.dummy = null;
        this.interval = null;
        this.line_height = this.options.lineHeight || parseInt(jQuery(e).css('line-height'));
        this.min_height = this.options.minHeight || parseInt(jQuery(e).css('min-height'));
        this.max_height = this.options.maxHeight || parseInt(jQuery(e).css('max-height'));;
        this.textarea = jQuery(e);

       if(this.line_height == NaN) this.line_height = 0;

       // Only one textarea activated at a time, the one being used
       this.init();     
    };  

    jQuery.autogrow.fn = jQuery.autogrow.prototype = { autogrow: '1.2.2' };
    jQuery.autogrow.fn.extend = jQuery.autogrow.extend = jQuery.extend;
    jQuery.autogrow.fn.extend({ init: function(){
       var self = this;
       this.textarea.css({overflow: 'hidden', display: 'block'});
       this.textarea.bind('focus', function(){ self.startExpand() }).bind('blur', function() { self.stopExpand() });
       this.checkExpand();
    },

    startExpand: function() { 
        var self = this;
        this.interval = window.setInterval(function() { self.checkExpand()}, 400); },
    stopExpand: function() { clearInterval(this.interval); },
    checkExpand: function() { 
       if (this.dummy == null) {
          this.dummy = jQuery('<div></div>');
          this.dummy.css({
             'font-size'  : this.textarea.css('font-size'),
             'font-family': this.textarea.css('font-family'),
             'width'      : this.textarea.css('width'),
             'padding'    : this.textarea.css('padding'),
             'line-height': this.line_height + 'px',
             'overflow-x' : 'hidden',
             'position'   : 'absolute',
             'top'        : 0,
             'left'    : -9999
          }).appendTo('body');
      }
// Strip HTML tags          
var html = this.textarea.val().replace(/(<|>)/g,'');
// IE is different, as per usual            
if ($.browser.msie){
    html = html.replace(/\n/g, '<BR>new');
} else {
    html = html.replace(/\n/g, '<br>new');
}

if (this.dummy.html() != html){
   this.dummy.html(html);

if (this.max_height > 0 && (this.dummy.height() + this.line_height > this.max_height)){
    this.textarea.css('overflow-y', 'auto');
} else { 
    this.textarea.css('overflow-y', 'hidden');
    if (this.textarea.height() < this.dummy.height() + this.line_height || (this.dummy.height() < this.textarea.height())) {
    this.textarea.animate({height: (this.dummy.height() + this.line_height) + 'px'}, 100); 
}
}
} 
}
}); 
})(jQuery);
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2009-11-07 10:49:30

关于jeerose的评论:

http://www.aclevercookie.com/aclevercookiecom-breached-problem-resolved/

访问者提醒我,当他们来到这个博客时,他们的病毒防护功能已经关闭。我调查了这件事,发现有害代码被注入到网站的源代码中。

这一问题已得到解决,并已采取措施加强该地点的安全。

谢谢你的报告,我为这个警报道歉。

这似乎不是真的。因为我的杀毒软件在打开那个站点时仍然会启动

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/1691730

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档