Question

我必须创建一个根据文本扩展的文本区域。文本区域最小化到原始大小的问题（我不希望这种情况发生）。

这是扩展的代码:(它来自一个前提问题）

$('texterea').keyup(function(e){
    if($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) { while($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth"))) { $(this).height($(this).height()+1); }; } else { while(!($(this).outerHeight() < this.scrollHeight + parseFloat($(this).css("borderTopWidth")) + parseFloat($(this).css("borderBottomWidth")))) { $(this).height($(this).height()-1); };

html：

<g:form action="reply" id="${conversationInstance.id}">
    <div class="convo-body">
        <textarea class="reply input-text-big" rows="1" name="message" placeholder="Send a reply"></textarea>
    </div>
    <div class="mt-16">
        <button type="submit" class="pull-right button-blue" disabled>Send</button>
    </div>
</g:form>

Answer 1

好吧，那段代码伤害了我的大脑，所以这里有一个编辑：

$('textarea').keydown(function(e){
    var $this = $(this),
        bw = parseFloat($this.css('border-top-width')) + 
            parseFloat($this.css('border-bottom-width')),
        thisTargetH = this.scrollHeight,
        thisOrigH = $this.outerHeight() - bw,
        diff = thisTargetH-thisOrigH;
    if( diff > 0 ){
         $this.height('+='+diff); 
    }
});

有关工作示例，请参阅this demo fiddle

展开文本区域 - 模糊事件，文本区域最小化为其原始大小

1 个答案: