jQuery-自动输入文字大小（不是textarea！）

Question

如何使用jQuery自动调整输入类型=“文本”字段的大小？我希望它一开始的宽度为100像素，然后在用户输入文字时使其自动变宽……这可能吗？

Answer 1

我认为没有完美的解决方案，因为您无法检测输入到输入元素的文本的实际宽度。这完全取决于您使用的字体，浏览器中的缩放设置等。但是，如果可以选择一种字体，在其中可以实际计算文本的像素数（这是最难的部分，但我想您可以尝试以某种方式进行估算）。您可以使用它来更改输入字段的宽度。 $('input').keyup(function () {     // I'm assuming that 1 letter will expand the input by 10 pixels     var oneLetterWidth = 10;     // I'm also assuming that input will resize when at least five characters     // are typed     var minCharacters = 5;     var len = $(this).val().length;     if (len > minCharacters) {         // increase width         $(this).width(len * oneLetterWidth);     } else {         // restore minimal width;         $(this).width(50);     } });

Answer 2

您好，我不知道您是否还在寻找，但是当我正在寻找一个脚本来做同样的事情时，我遇到了这个问题。因此，希望这对尝试这样做的人有所帮助。function editing_key_press(e){&nbsp; &nbsp; if(!e.which)editing_restore(this.parentNode);&nbsp; &nbsp; var text = $('<span>')&nbsp; &nbsp; &nbsp; &nbsp; .text($(this).val())&nbsp; &nbsp; &nbsp; &nbsp; .appendTo(this.parentNode);&nbsp; &nbsp; var w = text.innerWidth();&nbsp; &nbsp; text.remove();&nbsp; &nbsp; $(this).width(w+10);}此代码的逻辑是将内容跨度放在页面上，然后获取此内容的宽度并将其删除。我确实遇到的问题是我必须让它同时在keydown和keyup上运行才能成功工作。希望这会有所帮助，可能不会，因为我只是在短时间内进行jquery。