获取选中复选框的值?

用这个:

alert($(".messageCheckbox").is(":checked").val())

这假设要检查的复选框具有类“messageCheckbox”，否则您必须检查输入是否为复选框类型，等等。

在纯javascript中:

function test() {
var cboxes = document.getElementsByName('mailId[]');
var len = cboxes.length;
for (var i=0; i<len; i++) {
alert(i + (cboxes[i].checked?' checked ':' unchecked ') + cboxes[i].value);
}
}

function selectOnlyOne(current_clicked) {
var cboxes = document.getElementsByName('mailId[]');
var len = cboxes.length;
for (var i=0; i<len; i++) {
cboxes[i].checked = (cboxes[i] == current);
}
}

对于现代浏览器:

var checkedValue = document.querySelector('.messageCheckbox:checked').value;

通过使用jQuery:

var checkedValue = $('.messageCheckbox:checked').val();

纯javascript没有jQuery:

var checkedValue = null;
var inputElements = document.getElementsByClassName('messageCheckbox');
for(var i=0; inputElements[i]; ++i){
if(inputElements[i].checked){
checkedValue = inputElements[i].value;
break;
}
}

我在我的代码中使用这个。试试这个

var x=$("#checkbox").is(":checked");

如果复选框被选中，x将为真，否则将为假。

以上这些方法对我来说都没用，但只要使用以下方法即可:

document.querySelector('.messageCheckbox').checked;

在我的项目中，我通常使用以下片段:

var type[];
$("input[name='messageCheckbox']:checked").each(function (i) {
type[i] = $(this).val();
});

而且效果很好。

这并不能直接回答这个问题，但可能会对未来的访问者有所帮助。

如果你想让一个变量总是复选框的当前状态(而不是一直检查它的状态)，你可以修改onchange事件来设置该变量。

这可以在HTML中完成:

<input class='messageCheckbox' type='checkbox' onchange='some_var=this.checked;'>

或使用JavaScript:

cb = document.getElementsByClassName('messageCheckbox')[0]
cb.addEventListener('change', function(){some_var = this.checked})

如果你正在使用语义UI反应， data将作为第二个参数传递给onChange事件。

因此，你可以像下面这样访问checked属性:

<Checkbox label="Conference" onChange={(e, d) => console.log(d.checked)} />

<input class="messageCheckbox" type="checkbox" onchange="getValue(this.value)" value="3" name="mailId[]">


<input class="messageCheckbox" type="checkbox" onchange="getValue(this.value)" value="1" name="mailId[]">

function getValue(value){
alert(value);
}

当框没有被选中时，上面的工作对我来说都没有抛出错误，所以我做了一些沿着这些线的事情(onclick和复选框函数仅用于演示目的，在我的用例中，它是一个更大的表单提交函数的一部分):

function checkbox() {
var checked = false;
if (document.querySelector('#opt1:checked')) {
checked = true;
}
document.getElementById('msg').innerText = checked;
}

<input type="checkbox" onclick="checkbox()" id="opt1"> <span id="msg">Click The Box</span>

如果您想使用jQuery获取所有复选框的值，这可能会有所帮助。这将解析列表，并根据所需的结果执行其他代码。顺便说一下，出于这个目的，我们不需要用括号[]来命名输入。我没讲。

  $(document).on("change", ".messageCheckbox", function(evnt){
var data = $(".messageCheckbox");
data.each(function(){
console.log(this.defaultValue, this.checked);
// Do something...
});
}); /* END LISTENER messageCheckbox */

纯javascript和现代浏览器

// for boolean
document.querySelector(`#isDebugMode`).checked


// checked means specific values
document.querySelector(`#size:checked`)?.value ?? defaultSize

例子

<form>
<input type="checkbox" id="isDebugMode"><br>
<input type="checkbox" value="3" id="size"><br>
<input type="submit">
</form>


<script>
document.querySelector(`form`).onsubmit = () => {
const isDebugMode = document.querySelector(`#isDebugMode`).checked
const defaultSize = "10"
const size = document.querySelector(`#size:checked`)?.value ?? defaultSize
// 👇 for defaultSize is undefined or null
// const size = document.querySelector(`#size:checked`)?.value
console.log({isDebugMode, size})
return false
}
</script>

• optional_chainaining (?.)