如果第一个隐藏字段有内容,则向另一个隐藏输入字段添加复选框值
Add checkbox value to another hidden input field if first hidden field has content
我有一组4个复选框。
当任意两个被选中时,它们的值被复制到两个隐藏的输入字段。
第一个选中的复选框值为第一个输入id="checkedBox1"
我如何得到第二个复选框值去第二个隐藏的输入字段id="checkedBox2"
我已经使用下面的JavaScript函数将值从单个复选框中放入每个输入,但不知道如何遍历所有四个复选框的列表,并将两个选中的复选框放入每个单独的输入字段。
复选框:
<input type="checkbox" value="test1" id="a" name="one"><label>Test11</label>
<input type="checkbox" value="test2" id="b" name="one"><label>Test12</label>
<input type="checkbox" value="test3" id="c" name="one"><label>Test13</label>
<input type="checkbox" value="test4" id="d" name="one"><label>Test14</label>
<input type="hidden" value="" id="checkedBox1">
<input type="hidden" value="" id="checkedBox2">
<script>
function populate() {
var checkboxes = document.getElementsByName('one');
var ip1 = document.getElementById('checkedBox1');
var ip2 = document.getElementById('checkedBox2');
// clear current values
ip1.value = ip2.value = '';
var first = false;
var second = false;
// Loop over checkboxes,stop when found 2 that are checked
for (var i=0,iLen=checkboxes.length; i<iLen || !(first && second); i++) {
if (checkboxes[i].checked) {
if (!first) {
ip1.value = checkboxes[i].value;
first = true;
} else if (!second) {
ip2.value = checkboxes[i].value;
second = true;
}
}
}
}
$('input[type="checkbox"]').on('change', function() {
populate();
}).change();
</script>
您可以尝试纯JS,虽然我会使用表单属性访问而不是getElementsByName或getElementById:
function populate() {
var checkboxes = document.getElementsByName('one');
var ip1 = document.getElementById('checkedBox1');
var ip2 = document.getElementById('checkedBox2');
// clear current values
ip1.value = ip2.value = '';
var first = false;
var second = false;
// Loop over checkboxes,stop when found 2 that are checked
for (var i=0,iLen=checkboxes.length; i<iLen || !(first && second); i++) {
if (checkboxes[i].checked) {
if (!first) {
ip1.value = checkboxes[i].value;
first = true;
} else if (!second) {
ip2.value = checkboxes[i].value;
second = true;
}
}
}
}
编辑
谢谢Mal,每次添加一行来清除隐藏输入的值
相关文章:
- JavaScript 检查隐藏字段中的值并将其设置为隐藏字段值
- 带有验证和隐藏字段值的提交按钮
- 主干窗体隐藏字段未呈现
- 清除以前的$_GET值或不获取仅隐藏字段的值
- 添加和删除隐藏字段数组中的值,而不提交表单
- 在控制器上使用“$watch”时,为什么不更新此隐藏字段
- 将选项值附加到隐藏字段
- JQuery获取隐藏字段的值
- MVC+访问控制器中的隐藏字段
- ASP.net Javascript函数中的隐藏字段为null
- 在第一页加载时隐藏字段,而不是在php发布之后
- 表单使用js、html,而不是隐藏字段
- 如何根据文本长度立即显示和隐藏字段?-JQuery
- 在选择更改时显示大于/小于的隐藏字段集
- 如何获取多个复选框值并分配给隐藏字段
- 将会话登录页存储在cookie中以进行表单解析(通过隐藏字段)
- 将布尔值存储在隐藏字段中以进行表单处理
- 如何将多个/不同的隐藏字段插入 XML
- 如何通过 JSP 代码将隐藏字段(Javascript)插入 XML
- 如何使用Java在Selenium WebDriver的隐藏字段中键入一些文本