Lấy giá trị của hộp kiểm tra?

Vì vậy, tôi đã có mã trông như thế này:

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

Tôi chỉ cần Javascript để có được giá trị của bất kỳ hộp kiểm nào hiện đang được kiểm tra.

EDIT : Để thêm, sẽ chỉ có MỘT hộp kiểm tra.

Đối với các trình duyệt hiện đại :

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

Bằng cách sử dụngjQuery :

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

Javascript thuần túy không có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;
      }
}

Không có cái nào ở trên làm việc cho tôi mà chỉ đơn giản là sử dụng cái này:

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

Chúc mừng mã hóa.

Tôi đang sử dụng mã này trong mã của mình. Hãy thử điều này

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

Nếu hộp kiểm được chọn xsẽ đúng nếu không nó sẽ sai.

trong javascript đơn giản:

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

Điều này không trực tiếp trả lời câu hỏi, nhưng có thể giúp khách truy cập trong tương lai.

Nếu bạn muốn có một biến luôn là trạng thái hiện tại của hộp kiểm (thay vì phải tiếp tục kiểm tra trạng thái của nó), bạn có thể sửa đổi onchangesự kiện để đặt biến đó.

Điều này có thể được thực hiện trong HTML:

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

hoặc với JavaScript:

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

Dùng cái này:

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

Điều này giả sử các hộp kiểm để kiểm tra có lớp "messageCheckbox", nếu không, bạn sẽ phải thực hiện kiểm tra nếu đầu vào là loại hộp kiểm, v.v.

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

Nếu bạn đang sử dụng Semantic UI React , datađược chuyển làm tham số thứ hai cho onChangesự kiện.

Do đó, bạn có thể truy cập vào checkedtài sản như sau:

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

Không có cách nào ở trên hoạt động với tôi mà không gây ra lỗi trong bảng điều khiển khi hộp không được kiểm tra nên tôi đã làm gì đó dọc theo các dòng này (onclick và chức năng hộp kiểm chỉ được sử dụng cho mục đích demo, trong trường hợp sử dụng của tôi, đó là một phần của chức năng đệ trình biểu mẫu lớn hơn nhiều):

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>

Trong dự án của tôi, tôi thường sử dụng đoạn trích này:

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

Và nó hoạt động tốt. Trân trọng.