Question

所以我第一次使用html / javascript工作，我需要通过框/按钮获取用户输入并使用该数据来调用函数，如下所示：

<input id="xstart" type="number" min="0" max = "100"/>
<input id="ystart" type="number" min="0" max = "100"/>
<input id="zstart" type="number" min="0" max = "100"/>
<input id="clickit" type="button" value="click" onclick="myfunc(xstart, ystart, zstart);" />

function myfunc(num0, num1, num2) { do things with it }

我无法弄清楚如何让它工作，它似乎调用myfunc但它崩溃了因为xstart，ystart和zstart中的值实际上不是数字，我认为它们是字符串但我不确定。

第一次为程序员提供有关此类教程的任何帮助或链接都会有所帮助。谢谢。

Answer 1

首先，我建议您separate your HTML from your JS，以便于调试和更自由。

您可以将myFunc绑定到JS中的#clickit，如下所示：

document.getElementById('clickit').addEventListener('click', myFunc);

然后获取myFunc中的值并使用它们。 parseInt会将它们转换为数字。这是完整的代码：

var xInput = document.getElementById('xstart'),
    yInput = document.getElementById('ystart'),
    zInput = document.getElementById('zstart');

document.getElementById('clickit').addEventListener('click', myFunc);

function myFunc(){
    var xstart = parseInt( xInput.value ),
        ystart = parseInt( yInput.value ),
        zstart = parseInt( zInput.value );
    alert( xstart + ', ' + ystart + ', ' + zstart);
}

html将输入传递给具有用户输入的函数

1 个答案:

JS Fiddle Demo