javascript 数组javascript中的复选框值

Checkbox value in array javascript

提问by user2310422

I have a list of checkbox, my goal is to create and store the value of checkbox only the one that is checked. Can someone guide me with this?

我有一个复选框列表，我的目标是仅创建和存储选中的复选框的值。有人可以指导我吗？

<input type="checkbox" name="vehicle" value="Bike"/>
<input type="checkbox" name="vehicle" value="Car"/>
<input type="checkbox" name="vehicle" value="Airplane"/>

回答by Praveen kalal

Please do one thing change name vehicleto vehicle[]

请做一件事，将名称更改vehicle为vehicle[]

<input type="checkbox" name="vehicle[]" value="Bike"/>
<input type="checkbox" name="vehicle[]" value="Car"/>
<input type="checkbox" name="vehicle[]" value="Airplane"/>

at post you will receive the array of checked vehicle values and you can store it to DB

在发布后，您将收到检查车辆值的数组，您可以将其存储到 DB

in $_POST['vehicle']

在 $_POST['vehicle']

回答by RobG

You really should show some code of what you have tried. You can get the checkboxes by name, then loop over them and collect the values of those that are checked:

你真的应该展示一些你尝试过的代码。您可以按名称获取复选框，然后遍历它们并收集选中的值：

<script>

function getCheckboxValues(form) {
  var values = [];
  var vehicles = form.vehicle;

  for (var i=0, iLen=vehicles.length; i<iLen; i++) {
    if (vehicles[i].checked) {
      values.push(vehicles[i].value);
    }
  }
  // Do something with values
  alert("Vehicles: " + values.join(', '));
  return values;
}

</script>

<form onsubmit="getCheckboxValues(this); return false;">
  Bike: <input type="checkbox" name="vehicle" value="Bike"><br>
  Car: <input type="checkbox" name="vehicle" value="Car"><br>
  Aeroplane: <input type="checkbox" name="vehicle" value="Airplane"><br>
  <input type="reset"> <input type="submit">
</form>

回答by Kishan Patel

Look on live demo

看现场演示

http://jsbin.com/uwewi

http://jsbin.com/uwewi

<script>
$('input[name=vahicle]').click(function() {
    $('input[name=vahicle]:checked').not(this).removeAttr('checked');
});
</script>

OR

或者

jQuery - checkboxes like radiobuttons

jQuery - 像单选按钮这样的复选框

If you want to get only one value among this than please you radiobutton its best way.

如果您只想获得其中的一个值，请radio按最佳方式选择。

<input type="radio" name="vehicle" value="Bike"/>
<input type="radio" name="vehicle" value="Car"/>
<input type="radio" name="vehicle" value="Airplane"/>

OR

或者

If you want to go with checkboxthan you below jQuery;

如果你想checkbox在 jQuery 下使用；

<input type="checkbox" name="vehicle" value="Bike"/>
<input type="checkbox" name="vehicle" value="Car"/>
<input type="checkbox" name="vehicle" value="Airplane"/>
<script>
$('input[name=vahicle]').click(function(){
    $('input[name=vahicle]').removeAttr('checked');
    $(this).attr('checked', true);

});
</script>

Hope this will help you...!!

希望能帮到你...！！

回答by Jay Harris

Updated Answer

更新答案

var input = document.getElementsByTagName('input')
,   value = {0:'', 1:'', 2:''}
,   x = input.length--
,   array
,   box
;
function handle (x) {

 input[x].onchange = function () {
   box      = input[x];
   value[x] = box.checked ? box.value : '';
   array    = [value[0], value[1], value[2]];

   console.log(array);       
 };
}

while (x) handle(--x);

Working fiddle

工作小提琴

回答by ijse

If you use jQuery:

如果您使用 jQuery：

var vehicles = [];
$("input:checked").each(function() {
  vehicles.push($(this).val());
});

console.log(vehicles);