使用JavaScript获取表单变量 [英] getting form variables with JavaScript
问题描述
我有以下形式（通过php回显），当选择单选按钮时，我希望将该值传递给javascript函数，然后我可以处理它。
I have the following form(echoed through php), which when a radio button is selected, I want that value to be passed to a javascript function, which I can then deal with.
<form id=\"form1\" name=\"form1\" method=\"\" action=\"JavaScript:alterRecord()\">
<input name=\"radiobutton\" type=\"radio\" value=\"test1\" />Test 2<p>
<input name=\"radiobutton\" type=\"radio\" value=\"test2\" />Test 2<p>
<input name=\"radiobutton\" type=\"radio\" value=\"test3\" />Test 3<p>
<input name=\"radiobutton\" type=\"radio\" value=\"test4\" />Test 4
<input type=\"submit\" name=\"Submit\" value=\"Submit\" />
</form>
和JavaScript
And the JavaScript
function alterRecord(value) {
alert(value);
}
我无法找到如何获取javascript以获取表单提交的值。
I can not find out how to get the javascript to obtain the form submitted value.
推荐答案
如果你想在提交Javascript时做一些事情，但不有正常的POST或GET请求发生（导致旧页面卸载并加载新页面），请确保执行以下操作：
If you want to do something in Javascript on submit, but not have the normal POST or GET request occur (which causes the old page to unload and a new page to load), make sure to do something like this:
<html>
<head>
<style type="text/css">
body { background-color: black; color: white; }
</style>
<script type="text/javascript">
function handleClick(event)
{
if (console) console.info("handling click");
// for Firebug debugging, if you want it
/* do something here */
alert(this.textBox1.value);
// I don't like alerts but it works everywhere
if (console) console.info("handled click");
event.preventDefault(); // disable normal form submit behavior
return false; // prevent further bubbling of event
}
function doit()
{
if (console) console.info("starting doit()");
document.forms.myform.addEventListener("submit", handleClick, true);
return true;
}
</script>
</head>
<body onload="doit()">
<form name="myform">
<div>
<textarea name="textBox1" rows="10" cols="80">
'Twas brillig, and the slithy toves
Did gyre and gimble in the wabe;
All mimsy were the borogoves,
And the mome raths outgrabe.
</textarea>
</div>
<input type="submit" value="Update"/>
</form>
</body>
</html>
行 event.preventDefault（）和 return false 是关键。我也喜欢使用addEventListener，而不是在表单中硬编码onSubmit。我想，这只是风格/偏好的问题。 （尽管addEventListener允许您拥有多个处理程序。）
The lines event.preventDefault() and return false are key. I also like using addEventListener rather than hard-coding an onSubmit in the form. Just a matter of style/preference I guess. (although addEventListener does allow you to have multiple handlers.)
这篇关于使用JavaScript获取表单变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
