Question

我希望在文本接近结束时使文本字段扩展，它可以正常工作但是当我键入其中的第一个字母时缩小然后它会扩展

如何将文本字段保持相同的大小，直到它到达结尾并展开

即如此，当我输入我的第一个字母时，它不会收缩，但它会保持相同的大小

//HTML
<input type="text"/>


//JQUERY
$(document).ready(function(){
                $("input").keyup(function(){
                    contents = $(this).val();
                    charlength = contents.length;
                    newwidth = 10 + (charlength*10);
                    $(this).css({width:newwidth});
                });        
            });

Answer 1

我使用此插件：http://james.padolsey.com/javascript/jquery-plugin-autoresize/

$('textarea#comment').autoResize({
    // On resize:
    onResize : function() {
        $(this).css({opacity:0.8});
    },
    // After resize:
    animateCallback : function() {
        $(this).css({opacity:1});
    },
    // Quite slow animation:
    animateDuration : 300,
    // More extra space:
    extraSpace : 40
});

Answer 2

你可以使用这个插件： http://www.technoreply.com/autogrow-textarea-plugin/

Answer 3

$('textarea.expand').keypress(function () {
    if ((this.rows * this.cols) <= this.value.length) 
        $(this).animate({ height: "4em" }, 500); 
});

Live DEMO

Answer 4

Craig Buckler的jQuery TextAreaExpander插件运行正常。您可以对其进行测试here

只需将插件附加到您要展开的textarea;

$("textarea").TextAreaExpander();

当文本接近结尾时展开文本字段

4 个答案: