如何自动缩放文本输入的宽度以匹配其内容长度？

自动缩放文本输入宽度以匹配值长度

有没有办法自动调整来匹配它包含的文本的宽度？

解决方案：

是的，您可以通过将输入的 size 属性设置为文本的长度来轻松实现此目的输入内容。以下是使用 JavaScript 实现此操作的方法：

function resizeInput() {
    $(this).attr('size', $(this).val().length);
}

$('input[type="text"]')
    // event handler
    .keyup(resizeInput)
    // resize on page load
    .each(resizeInput);

演示：

[请参阅 JSFiddle](http://jsfiddle.net/nrabinowitz/NvynC/)

但是，该方法可能会在右侧添加一些padding，具体取决于浏览器。为了实现更紧密的配合，您可以使用[此](https://stackoverflow.com/questions/16401893/set-width-of-input-field-to中描述的技术来计算文本的像素宽度-display-values-with-fixed-width-in-chrome）堆栈溢出答案。

以上是如何自动缩放文本输入的宽度以匹配其内容长度？的详细内容。更多信息请关注PHP中文网其他相关文章！