Javascript表单可变位置持有人

Question

我目前正在创建一个表单，当用户填写时，会将所有表单信息放入预先设计的文档中。例如，用户将填写他们的名字，姓氏，地址等，表格下面的文件会自动填入已输入的表格信息。所有这一切都很完美。但是，我希望我在文档中使用的文本框保存变量以删除输入变量时留下的额外空白。有些名称可能比其他名称更长，我不希望文档中有额外的空格。有没有办法让我的文本框的宽度基于其中包含的变量？

Answer 1

嗯，没有CSS方法可以做到这一点，但你可以使用JavaScript并做一个很好的估计。这样的事情。

var el = document.getElementById('myInput');

el.addEventListener('keypress', function(e) {
    e.target.style.width = e.target.value.length * 10 + 'px';
});

这里的逻辑是，只要在选择输入时按下某个键，回调就会找到文本的长度，并将元素的大小调整为* 10像素宽的字符长度。当字符像素宽度变化时，这不是非常精确。