获取表单帖子外部的单选按钮值
Get radio button value which is outside a form post
我有一个表单,它有一些单选按钮,在这个表单之外
<input type="radio" id="radio1" name="radios" value="radio1" checked>
<label for="radio1">Credit Card</label>
<input type="radio" id="radio2" name="radios"value="radio2">
<label for="radio2">Debit Card</label>
<form method="post" action='./process.php'>
<label>name</label>
<input type="text"/>
<input type="submit" style="float:right" value="Pay Now"/>
</form>
当我按下paynow按钮时,我想把所选按钮的值传递给这个表单的php(process.php)。但我不想把单选按钮放在表单中。有什么解决方案吗?
您可以在表单中有一个隐藏值,onsubmit将该单选按钮的值放入隐藏值中
<input type="radio" name="test" value="a">a<br>
<input type="radio" name="test" value="b">b
<form>
<input type="hidden" name="test" id="hidden">
<submit onClick="transferData">
</form>
<script>
var transferData = function() {
var radioVal =$('input:radio[name=test]:checked').val()
$('#hidden').val(radioVal);
}
</script>
HTML5支持一个名为"form"的属性。您可以使用它为表单外的控件设置表单,例如:
<input type="radio" id="radio1" name="radios" value="radio1" checked>
<label form="myForm" for="radio1">Credit Card</label>
<input type="radio" id="radio2" name="radios"value="radio2">
<label form="myForm" for="radio2">Debit Card</label>
<form id="myForm" method="post" action='./process.php'>
<label>name</label>
<input type="text"/>
<input type="submit" style="float:right" value="Pay Now"/>
</form>
请注意如何将id="myForm"添加到表单中,以及如何将form="myForms"添加到单选按钮中。希望对你有所帮助。
</body>
之前添加对jQuery的引用。然后,使用JQuery,您可以选择选中的单选按钮,如下所示:
var selected = $("input[type='radio']:checked");
if (selected.length > 0) {
selectedVal = selected.val();
}
selectedVal参数将保存您想要的值。
所选单选按钮的选择应在提交按钮的点击事件上完成。
可以这样做:
$("input[type='submit']").click(function(){
// code goes here.
});
表单上必须有一个onsubmit
属性,并且在表单内部,将所选单选按钮值分配给隐藏字段。
像这样:
<form id='myForm' method="post" action='./process.php' onsubmit='getRadioButtonValue()'>
...
<input type="hidden" name="selectedRadioValue" />
</form>
function getRadioButtonValue(){
var radioValue = $('input[name=radios]:checked', '#myForm').val();
$('input[name='selectedRadioValue']').val(radioValue);
}
将所有内容放入表单中。如果要发送所有值。将所需的属性添加到标签中。
其他明智的使用jquery
<form id="test" method="POST">
<input type="text" id="name" required minlength="5" name="name"/>
<input type="password" id="pw" required name="pw"/>
<input id ="sub" type="submit"/>
</form>
<ul id="answerswer"></ul>
</body>
<script>
$("#sub").click(function(event){
event.preventDefault();
query = $.post({
url : 'check_ajax.php',
data : {'name': $('input[name=name]').val(), 'pw': $('#pw').val()},
});
query.done(function(response){
$('#answer').html(response);
});
});
</script>
您所需要做的就是将表单外的选项/输入的值添加到数据
使用此onsubmit事件!
$('input[name=radios]:checked').val()
检查示例
相关文章:
- 多个单选按钮组相互干扰
- 是否可以禁用jquery中的单个单选按钮
- Javascript:无法获取变量中的单选按钮值
- 通过ajax到php文件获取单选按钮值
- 互斥单选按钮和相应的输入字段
- 用于选择MVC3中单选按钮值的JavaScript
- 如何获取单选按钮的多个实例的选定单选按钮值
- react testUtils模拟点击单选按钮而不触发onchange
- 当选择组中的单选按钮时,jQuery addClass
- Angularjs无法将单选按钮与嵌套范围内的模型绑定
- 客户端单选按钮列表验证
- Javascript:图像与单选按钮的值不匹配
- 如何在Javascript中将单选按钮值保存到cookie中
- 单击时如何更改单选按钮的CSS
- 获取表单帖子外部的单选按钮值
- 计算单选按钮的总和,显示总和,并传递给外部 Beanstream 服务器
- 如何显示或隐藏<选项>s基于从外部单选按钮组中单击的内容
- 剑道UI "checked"外部模板中最后一个单选按钮的MVVM绑定不工作
- 单选按钮,参考外部文件
- AngularJS:通过点击外部元素选择单选按钮