Question

我需要一个带复选框的下拉菜单，但不使用选择功能，因为我想一次选中多个复选框（我不希望选中多个复选框）。

我尝试将类添加到复选框，然后通过jQuery或香草Javascript检查是否已“选中”，但是我没有得到答案。

我如何签入jQuery-

if($('.apple').is(':checked')){
    alert('I WAS CLICKED')
}

我如何检查JS-

let apple = document.getElementByClassName('apple')

if(apple.checked){
  alert('I WAS CLICKED')
}

这是小提琴：http://jsfiddle.net/8L4g5dov/3/

Answer 1

您当前的代码仅确定复选框在运行时是否已选中。您需要在复选框上监听事件，然后对其进行响应。

jQuery：

$('.apple').change(function() {
    if ($(this).is(':checked')) {
        alert('I WAS CHECKED');
    }
});

香草JS：

let checkboxNodes = document.getElementByClassName('apple');
let checkboxArray = Array.from(checkboxNodes); // ways to shorten but here for clarity.

function respondToCheck() {
    if (this.checked) {
        alert('I WAS CLICKED');
    }
}

checkboxArray.forEach(el => el.addEventListener('change', respondToCheck));

Answer 2

我检查了你的小提琴，发现的解决方法是：

 items.addEventListener('click', function(){
   $('input[type=checkbox]:checked').each(function () {
    console.log($(this).parent('li').text())
   }) 
 })

希望有帮助

检查复选框已选中

2 个答案: