JavaScript/CSS - 更新多个输入元素的值*和*大小

Question

我有一个包含 html、javascript 和 css(无外部 jquery)的数字基数转换页面，我在其中输入一个输入字段，然后实时更新多个其他输入字段，并为每个输入使用不同基数中的相应值 field 。这些多个值，大约有5打，都是不同的长度，所以我手动设置每个输入长度为size =“43”，size =“50”等。是否也可以实时更新每个输入字段的大小以匹配其动态更新的内容，使用 javascript 和 css 但不使用 jquery？如果有帮助的话，每个元素也都在自己的 div 中，或者如果需要的话，也可以在自己的 span 中。我已经尝试了至少六条在网上找到的建议，但到目前为止没有一个有效，因为它们都依赖于 1)“onkey”或“blur”事件，其中除了我输入的 1 个输入字段之外没有其他事件，因此这不适用于其他几十个字段中的任何一个，或者 2) 按特定名称更新一个特定输入字段，这也不适用，因为我有几十个字段，每个字段都有不同的输入 id。一个简短而优雅的解决方案会更好，但我愿意尝试任何事情。谢谢!

Answer 1

使用setAttribute命令更改元素的值。请参阅下面的示例。

HTML

<td><input type=text name=script_id id="id" onblur="myFunctionY(this)" placeholder="19506"></td>
<td><input type=text name=dep id="dep" placeholder="dependency"></td>

JS

<script type=text/javascript>
function myFunctionY(vari) {
console.log(vari.value);
document.query_form.dep.setAttribute("value",vari.value);
   }
</script>

dep 是输入元素的 idquery_form 是表单名称

本质上，调用函数onblur，然后获取输入的输入值。使用表单名称的 setAttribute 函数来更新输入字段的特定值。