Question

我有一个类似

的复选框

<input type='checkbox' class='mycheck' name='selected' value="something">

我必须删除100多个这样的复选框，我无法使用id在DOM中标识它们，所以不知道如何在复选框选择上做些什么

类似

<script>
 $('.mycheck:checkbox:checked').change(function() {
      alert("helloo");   
    });

</script>

我想在此事件之后将复选框的值存储在数组中

Answer 1

您可以简单地使用this来引用事件处理函数中的当前元素：

$('.mycheck:checkbox').change(function() {
  if(this.checked)
    console.log('checked');
  else
    console.log('not checked');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='mycheck' name='selected' value="something">
<input type='checkbox' class='mycheck' name='selected' value="something2">

Answer 2

可以选中复选框值，如下例所示。

示例：

 $('.mycheck:checkbox').change(function() {
   if ($(this).is(":checked"))
     alert("helloo");
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='mycheck' name='selected' value="something">
<input type='checkbox' class='mycheck' name='selected1' value="something">
<input type='checkbox' class='mycheck' name='selected2' value="something">

Answer 3

您可以使用this.checked检查是否选中了一个复选框。然后提醒该复选框是否已选中。因此，您只需要定位此类元素$('.mycheck')：

$('.mycheck').change(function() {
    if(this.checked) {
      alert("Checked!");
    } 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='mycheck' name='selected' value="something">

Answer 4

在绑定事件处理程序和:checked与.map()一起使用时，删除.filter()选择器可用于获取数组中的选定值。

var selectedValues;
var checkboxes = $('.mycheck:checkbox').change(function() {
  selectedValues = checkboxes.filter(':checked').map(function() {
    return $(this).val();
  }).get();

  console.log(selectedValues);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='mycheck' name='selected' value="something">
<input type='checkbox' class='mycheck' name='selected1' value="something1">
<input type='checkbox' class='mycheck' name='selected2' value="something2">

Answer 5

您可以在全局范围内指定一个数组，并使用该数组根据已选中和未选中的复选框来推送和删除值：

var value = [];
$('.mycheck').change(function() {
  var cbValue = $(this).val();
  if($(this).is(':checked')){
    value.push(cbValue);
  } else {
    value.splice(value.indexOf(cbValue), 1);
  } 
  console.log(value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='mycheck' name='selected' value="something">
<input type='checkbox' class='mycheck' name='selected' value="something2">
<input type='checkbox' class='mycheck' name='selected' value="something3">
<input type='checkbox' class='mycheck' name='selected' value="something4">

Answer 6

尝试一下。

HTML

<input type='checkbox' class='mycheck' name='selected' value="something">
<input type='checkbox' class='mycheck' name='selected1' value="something1">
<input type='checkbox' class='mycheck' name='selected2' value="something2">
<input type='checkbox' class='mycheck' name='selected2' value="something3">

JQuery

$(document).ready(function() {
            const arrayA = [];
            var i = 1;

            $('.mycheck:checkbox').change(function() {
                if($(this).prop('checked') == true){
                    arrayA.push($(this).val()); // store value in array                     
                } else {
                    // use if uncheck checkbox
                }
            });
        });

显示数组

console.log(arrayA);

在根据类别或名称选择复选框后，调用函数

6 个答案: