【问题标题】:Making a textbox adjust to the width of the text使文本框适应文本的宽度
【发布时间】:2012-11-25 07:35:33
【问题描述】:

是否可以仅使用 CSS 使输入文本扩展或缩小到文本的宽度?

【问题讨论】:

  • 你为什么想要那个?
  • @JukkaK.Korpela 我用它来实时编辑元素中的文本,因此它可以作为包含文本的元素大小的预览
  • 那么自然的方法是使用带有contenteditable 属性的span 元素。这避免了 input 元素可能与普通元素不同的任何渲染特殊性。

标签: html css forms text


【解决方案1】:

仅使用 CSS 是不可能的,您需要为此使用一些 jQuery -

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

$('input[type="text"]').keyup(resizeInput).each(resizeInput);

Working Demo

【讨论】:

  • thanx,你为什么用each
  • @IlyaD each 用于启动函数onload...你可以删除每个看看效果:)
  • 将文本粘贴到字段中会发生什么?
猜你喜欢
  • 2014-05-10
  • 1970-01-01
  • 2012-12-11
  • 1970-01-01
  • 2015-02-27
  • 1970-01-01
  • 2012-09-18
  • 1970-01-01
  • 2023-03-08
相关资源
最近更新 更多