我得到的代码是这样的:

<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">

我只需要Javascript来获取当前选中的复选框的值。

编辑:要添加,将只有一个复选框。


用这个:

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();
            });

而且效果很好。


$(document).ready(function() { var ckbox = $("input[name='ips']"); var chkId = ''; $('input').on('click', function() { if (ckbox.is(':checked')) { $("input[name='ips']:checked").each ( function() { chkId = $(this).val() + ","; chkId = chkId.slice(0, -1); }); alert ( $(this).val() ); // return all values of checkboxes checked alert(chkId); // return value of checkbox checked } }); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <input type="checkbox" name="ips" value="12520"> <input type="checkbox" name="ips" value="12521"> <input type="checkbox" name="ips" value="12522">


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


如果您想让一个变量始终是复选框的当前状态(而不是必须不断检查其状态),您可以修改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 React,数据会作为第二个参数传递给onChange事件。

因此,您可以按以下方式访问选中的属性:

<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和复选框函数仅用于演示目的,在我的用例中,它是一个更大的表单提交函数的一部分):

函数复选框(){ Var检查= false; if (document.querySelector('#opt1:checked')) { 选中= true; } . getelementbyid(“味精”)。innerText =已检查; } <input type="checkbox" onclick="checkbox()" id="opt1"> <span id="msg">单击方框</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解决方案(当您遵循最佳实践并为每个HTML元素使用不同的id时,投票最多的答案是无效的)。然而,这对我来说很管用:

Array.prototype.slice.call(document.querySelectorAll("[name='mailId']:checked"),0).map(function(v,i,a) { 
      return v.value; 
  });

您可以通过jQuery或JavaScript使用以下方法来检查复选框是否被单击。

$('.messageCheckbox').is(":checked"); // jQuery
document.getElementById(".messageCheckbox").checked //JavaScript

在jQuery中获取检查值:

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