向原生JavaScript传递数字输入框值的实现问题求助

我来帮你看看问题出在哪哈～你的代码里有两个关键问题导致没法正常传递输入框的数值：

• 直接在onClick里写how(example)，这里的example并没有指向输入框元素，浏览器会把它当成未定义的变量；
• 函数里的alert("example")只是弹出字符串"example"，而不是你传入的输入框实际值。

下面是修正后的完整代码：

<input type="number" name="example" id="exampleInput"> 
<input type="button" name="button" value="Click" onClick="how(document.getElementById('exampleInput').value)"> 

<script type="text/javascript">
function how(inputValue){
  alert("你输入的数值是：" + inputValue);
}
</script>

关键修改点说明： #

1. 给数字输入框添加了id="exampleInput"，这样可以通过document.getElementById精准获取到输入框元素；
2. 在按钮的onClick事件里，通过document.getElementById('exampleInput').value直接获取输入框的当前值，再传递给how函数；
3. 函数里把参数名改成inputValue（名字可以自定义），然后在alert里拼接这个变量，这样就能显示用户输入的数值了。

另外，如果你不想用id，也可以通过name属性获取元素，比如document.getElementsByName('example')[0].value，不过用id的方式更直接可靠哦～

内容的提问来源于stack exchange，提问作者js_student-92