JavaScript - 如何更改字段值 oninput 和 onchange

Question

我不知道如何使用 oninput 或 onchange 方法更改表单字段值。例如，我需要让一个输入字段在另一个输入字段被更改时立即更改其值。所以我正在尝试:

<input type="number" id="a" value="999.99" oninput="updateInput(value)"/>
<input type="number" id="b" value=""/>

<script>
    $(document).ready(function updateInput(value) {
        document.getElementById("b").value = document.getElementById("a").value;
    });
</script> 

它什么都不做。我究竟做错了什么？

在另一种情况下，我需要根据另一个下拉菜单更改下拉菜单的值(使用 if 子句)。由于上面的简单脚本已经不起作用，我什至不知道如何处理第二个脚本...

Answer 1

这里有几个问题；第一个要解决的问题是您声明函数的位置。 Javascript 有一个范围 的概念，您可以将其视为声明变量的一种容器。您的函数没有执行任何操作的原因是因为 updateInput 的定义被锁定在您的 jquery $(document).ready 范围内。

一旦您从 jquery 包装器中取出该定义，它就可用于全局窗口范围 - 这是您在 oninput 中访问的范围。我应该指出，有更灵活/有用的方法可以将事件监听器放在某物上，但如果这是一个简单的用例，您所拥有的将起作用。

function updateInput(value) {
    document.getElementById("b").value = document.getElementById("a").value;
}

 <input type="number" id="a" value="999.99" oninput="updateInput(value)"/>
 <input type="number" id="b" value=""/>