Question

我不知道为什么它不起作用：

html>

<form id="myForm">
<input type="number" name="thing1"> 
<input type="number" name="thing2">
<input type="number" name="thing3">
<input type="button" name="button" onclick="getData()" value="Submit">


</form>

<script>


function getData(){
     var data = [];
    data[0] = form.thing1.value;
    data[1] = form.thing2.value;
    data[2] = form.thing3.value;

 return data;   
}

var x = getData();

document.write(x[0]);


</script>


</html>

我也试过使用document.getElementById，但这也不起作用我想将数据用于进一步的计算，因此它应该是整数格式。

Answer 1

使用id而非name。

<input type="number" id="thing1"> 
<input type="number" id="thing2">
<input type="number" id="thing3">

document.getElementById('thing1').value;

Answer 2

form.thing1.value无法正常工作，因为您没有名为form的变量

getElementById无法工作（大概）因为输入没有名字。

将var form = document.getElementById("myForm");添加到您的功能顶部。

Answer 3

不要在HTML中提供名称，而是为输入

提供 ID

<input type="number" id="thing1"> 
<input type="number" id="thing2">
<input type="number" id="thing3">

然后在文档中按ID获取元素

var inp1 = document.getElementById('thing1').value

Answer 4

请尝试以下代码。我使用getElementsById来获取值。

    <html>      
    <form id="myForm">
    <input type="number" name="thing1"> 
    <input type="number" name="thing2">
    <input type="number" name="thing3">
    <input type="button" name="button" onclick="getData()" value="Submit">


    </form>

    <script>


    function getData(){
        var data = [];
        data[0] = document.getElementsByName('thing1')[0].value;
        data[1] = document.getElementsByName('thing2')[0].value;
        data[2] = document.getElementsByName('thing3')[0].value;
        console.log(data); // Check the console for the values for every click.
    return data;   
    }

    var x = getData(); // When this is executed there will be no values in the input.



    </script>


    </html>

如何使用JavaScript从html表单中获取数字值？

4 个答案: