gpt4 book ai didi

javascript - 在文本区域 javascript 上显示选中的复选框值

转载 作者:行者123 更新时间:2023-11-28 15:05:03 24 4
gpt4 key购买 nike

我正在尝试获取提供的输入字段上所有复选框选中的值。我正在使用 javascript 来获取值,但它只显示一个已检查的值。当我选中另一个复选框时,它仅显示第二个复选框。这是我到目前为止所做的:

<html>
<head>
<script type="text/javascript">
function checkbox(val){
document.getElementById("show").value = val;
}
</script>
</head>
<body>
<form>
<input type="checkbox" id="bk" name="vehicle" onClick="checkbox(this.value);" value="Bike">I have a bike<br></br>
<input type="checkbox" id="cr" name="vehicle" onClick="checkbox(this.value);" value="Car">I have a car<br></br>
<input type="text" id="show" name="vehicle"><br>
<input type="submit" value="Showe">
</form>
</body>
</html>

正如我所说,这个仅显示单个检查值,但我想显示指定输入字段上的所有检查值!谢谢!

最佳答案

您的代码仅将当前单击的项目发送到该方法。您需要查看该方法中的所有复选框并找到选中的复选框,将它们放入数组中,然后将数组值插入到输入中。另外值得注意的是,当您这样做并在每次单击时构建数组时,当您取消选中它们时,它也会使项目看起来好像从输入中删除。

function checkbox(){

var checkboxes = document.getElementsByName('vehicle');
var checkboxesChecked = [];
// loop over them all
for (var i=0; i<checkboxes.length; i++) {
// And stick the checked ones onto an array...
if (checkboxes[i].checked) {
checkboxesChecked.push(checkboxes[i].value);
}
}
document.getElementById("show").value = checkboxesChecked;

}
    <form>
<input type="checkbox" id="bk" name="vehicle" onClick="checkbox();" value="Bike">I have a bike<br></br>
<input type="checkbox" id="cr" name="vehicle" onClick="checkbox();" value="Car">I have a car<br></br>
<input type="text" id="show" name="vehicle"><br>
<input type="submit" value="Showe">
</form>

关于javascript - 在文本区域 javascript 上显示选中的复选框值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39349191/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com