[嗨,我正在尝试将onclick事件上的变量传递给javascript函数。我正在尝试以下方式,但无法在javascript函数中获取输入值。(我希望收到1的警报。)这样做是否正确?请帮助。
<head>
<script>
function submit_value(form) {
alert(form.ip.value);
}
</script>
</head>
<table>
<tr>
<form>
<td>
<input id="ip" type="text" value="1">
</td>
<td>
<a href="javascript:;" onClick="submit_value(this)">Button</a>
</td>
</form>
</tr>
</table>
您的脚本不知道form
是什么。您需要指定document.forms[0].ip.value
。
如果文档上有多个表单,那么最好先将表单元素存储在变量中。您可以在表单上找到该ID ...
<form id="formID">
并且您可以在Submit_value函数中使用
var myForm = document.getElementById('formID');
alert(myForm.ip.value);
编辑:
您可以将this.form
用于锚标记的onClick。
jQuery无处不在。您不需要JQuery。人们为什么忘记DOM对象模型?他几乎以正确的方式完成了所有工作:
<head>
<script>
function submit_value() {
alert(document.forms[0].ip.value);
}
</script>
</head>
<table>
<tr>
<form>
<td>
<input name="ip" type="text" value="1">
</td>
<td>
<a href="javascript:;" onClick="submit_value()">Button</a>
</td>
</form>
</tr>
</table>
或者您可以添加表格ID
<head>
<script>
function submit_value() {
alert(document.forms.formid.ip.value);
}
</script>
</head>
<table>
<tr>
<form id='formid'>
<td>
<input name="ip" type="text" value="1">
</td>
<td>
<a href="javascript:;" onClick="submit_value()">Button</a>
</td>
</form>
</tr>
</table>
将功能更改为此:
function submit_value(form) {
alert(document.getElementById('ip').value);
}
[编写submit_value(this)
时,this
的值实际上是元素<a>
本身,而不是形式。
我假设您可以使用jquery。选择器对此非常简单。
更改以下形式的html自
<form>
<td>
<input id="ip" type="text" value="1">
</td>
<td>
<a href="javascript:;" onClick="submit_value(this)">Button</a>
</td>
</form>
to
<form>
<td>
<input id="ip" type="text" value="1">
</td>
<td>
<a href="" class="mySubmitButton">Button</a>
</td>
</form>
然后您的JS看起来像
$('.mySubmitButton').click(function() {
var inputBox = $(this).prev();
alert(inputBox.val());
return false; //This prevents the default function submit . Similar to event.preventDefault
});
我们可以在没有给定ID且没有JQuery的情况下进行操作。有关详细信息,请参见FormData。
function test(frm) {
const formData = new FormData(frm);
for (var value of formData.values()) {
console.log(value);
}
}
<form action="/action_page.php">
<label for="fname">First name:</label><br>
<input type="text" id="fname" name="fname" value="John"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="button" value="Submit" onclick="test(this.form)">
</form>