Javascript 选中复选框时提交表单
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10602470/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
submitting a form when a checkbox is checked
提问by user1394849
is there are way to submit a form when a checkbox is checked?
有没有办法在选中复选框时提交表单?
<form id="formName" action="<?php echo $_SERVER['PHP_SELF'];?>" method="get">
<input type ="checkbox" name="cBox[]" value = "3">3</input>
<input type ="checkbox" name="cBox[]" value = "4">4</input>
<input type ="checkbox" name="cBox[]" value = "5">5</input>
<input type="submit" name="submit" value="Search" />
</form>
<?php
if(isset($_GET['submit'])){
include 'displayResults.php';
}
?>
That is what I have currently, but I would like to submit the form without a submit button, when the user checks or unchecks a checkbox. Any help?
这就是我目前所拥有的,但是当用户选中或取消选中复选框时,我想提交没有提交按钮的表单。有什么帮助吗?
回答by Sliq
In plain JavaScript simply put
在普通的 JavaScript 中简单地说
onChange="this.form.submit()"
into the form/input tag.
进入表单/输入标签。
回答by Surreal Dreams
Yes, this is possible.
是的,这是可能的。
<form id="formName" action="<?php echo $_SERVER['PHP_SELF'];?>" method="get">
<input type ="checkbox" name="cBox[]" value = "3" onchange="document.getElementById('formName').submit()">3</input>
<input type ="checkbox" name="cBox[]" value = "4" onchange="document.getElementById('formName').submit()">4</input>
<input type ="checkbox" name="cBox[]" value = "5" onchange="document.getElementById('formName').submit()">5</input>
<input type="submit" name="submit" value="Search" />
</form>
By adding onchange="document.getElementById('formName').submit()"
to each checkbox, you'll submit any time a checkbox is changed.
通过添加onchange="document.getElementById('formName').submit()"
到每个复选框,您将在更改复选框时随时提交。
If you're OK with jQuery, it's even easier (and unobtrusive):
如果你对 jQuery 没问题,它会更容易(而且不显眼):
$(document).ready(function(){
$("#formname").on("change", "input:checkbox", function(){
$("#formname").submit();
});
});
For any number of checkboxes in your form, when the "change" event happens, the form is submitted. This will even work if you dynamically create more checkboxes thanks to the .on()
method.
对于表单中任意数量的复选框,当“更改”事件发生时,表单将被提交。如果您使用该.on()
方法动态创建更多复选框,这甚至会起作用。
回答by Gorving
$(document).ready(
function()
{
$("input:checkbox").change(
function()
{
if( $(this).is(":checked") )
{
$("#formName").submit();
}
}
)
}
);
Though it would probably be better to add classes to each of the checkboxes and do
虽然最好为每个复选框添加类并执行
$(".checkbox_class").change();
so that you can choose which checkboxes submit the form instead of all of them doing it.
这样您就可以选择哪些复选框提交表单,而不是所有复选框都提交。
回答by bramwolf
I've been messing around with this for about four hours and decided to share this with you.
我一直在纠结这个大约四个小时,并决定与你分享这个。
You can submit a form by clicking a checkbox but the weird thing is that when checking for the submission in php, you would expect the form to be set when you either check or uncheck the checkbox. But this is not true. The form only gets set when you actually checkthe checkbox, if you uncheck it it won't be set. the word checked at the end of a checkbox input type will cause the checkbox to display checked, so if your field is checked it will have to reflect that like in the example below. When it gets unchecked the php updates the field state which will cause the word checked the disappear.
您可以通过单击复选框来提交表单,但奇怪的是,在 php 中检查提交时,您希望在选中或取消选中复选框时设置表单。但事实并非如此。只有在您实际选中复选框时才会设置该表单,如果您取消选中它,它将不会被设置。在复选框输入类型末尾选中的单词将导致复选框显示为选中状态,因此如果您的字段被选中,它将必须反映如下示例中的内容。当它被取消选中时,php 会更新字段状态,这将导致选中的单词消失。
You HTML should look like this:
您的 HTML 应如下所示:
<form method='post' action='#'>
<input type='checkbox' name='checkbox' onChange='submit();'
<?php if($page->checkbox_state == 1) { echo 'checked' }; ?>>
</form>
and the php:
和 php:
if(isset($_POST['checkbox'])) {
// the checkbox has just been checked
// save the new state of the checkbox somewhere
$page->checkbox_state == 1;
} else {
// the checkbox has just been unchecked
// if you have another form ont the page which uses than you should
// make sure that is not the one thats causing the page to handle in input
// otherwise the submission of the other form will uncheck your checkbox
// so this this line is optional:
if(!isset($_POST['submit'])) {
$page->checkbox_state == 0;
}
}