如何将表单输入值传递到JavaScript函数中

我有一个使用一个参数的通用JavaScript函数

function foo(val) { ...} 

我想在提交表单时调用函数

<form>
<input type="text" id="formValueId"/>
<input type="button" onclick="foo(this.formValueId)"/>
</form>

但是表达式foo（this.formValueId）不起作用（毫不奇怪，这是一次绝望的尝试），所以问题是，如何将表单值传递给javascript函数。 正如我提到的，javascript是通用的，我不想操纵它里面的表单

---

我可以在中间创建一个帮助函数，用jQuery（例如）获取表单值，然后调用函数，但是我想知道如果没有助手函数，我能不能做它。

给出输入名称，这将使它更容易

<form>
<input type="text" id="formValueId" name="valueId"/>
<input type="button" onclick="foo(this.form.valueId.value)"/>
</form>

---

使用

onclick=“foo（document.getElementById（'formValueId'）.value）”

取出内联单击处理程序并像这样做可能会更干净：

$(document).ready(function() {
    $('#button-id').click(function() {
      foo($('#formValueId').val());
    });
});

---

有几种方法可以做到这一点。就我个人而言，我会的。既然已经标记了jQuery，我们就使用它

HTML:

<form>
    <input type="text" id="formValueId" name="valueId"/>
    <input type="button" id="myButton" />
</form>

$(document).ready(function() {
    $('#myButton').click(function() {
      foo($('#formValueId').val());
    });
});

更稳定的方法：

<form onsubmit="foo($("#formValueId").val());return false;">
<input type="text" id="formValueId"/>
<input type="submit" value="Text on the button"/>
</form>

---

返回false是为了防止实际的表单提交（假设您需要的话）。
您可以这样做

    <input type="text" name="address" id="address">
        <div id="map_canvas" style="width: 500px; height: 300px"></div>
    <input type="button" onclick="showAddress(address.value)" value="ShowMap"/>

这是一个同样的例子。这可能就是你的答案。演示：您试图调用的方法未定义。请注意，可以通过在文本字段中按Enter键（而不是在IE中）提交此表单，并且不会触发您的按钮单击。请添加java脚本，而不是
onclick=“foo（this.form.valueId.value）”
我们可以使用
onclick=“foo（valueId.value）“
。它可以工作。。。
<form onsubmit="foo($("#formValueId").val());return false;">
<input type="text" id="formValueId"/>
<input type="submit" value="Text on the button"/>
</form>

    <input type="text" name="address" id="address">
        <div id="map_canvas" style="width: 500px; height: 300px"></div>
    <input type="button" onclick="showAddress(address.value)" value="ShowMap"/>

function showAddress(address){

    alert("This is address :"+address)

}