javascript - 체크여부 - jQuery로 체크 박스가 선택되어 있는지 확인하십시오.




jquery 다중 체크박스 체크여부 (14)

확인란 배열의 ID를 사용하여 확인란 배열의 확인란을 선택하면 어떻게 확인할 수 있습니까?

다음 코드를 사용하고 있지만 항상 id에 상관없이 체크 된 체크 상자의 수를 반환합니다.

function isCheckedById(id) {
  alert(id);
  var checked = $("input[@id=" + id + "]:checked").length;
  alert(checked);

  if (checked == 0) {
    return false;
  } else {
    return true;
  }
}

checked 속성에 대해 기억해야 할 가장 중요한 개념은 checked 속성과 일치하지 않는다는 것입니다. 속성은 실제로 defaultChecked 속성에 해당하며 확인란의 초기 값을 설정하는 데에만 사용해야합니다. 체크 된 속성 값은 checkbox의 상태에 따라 변하지 않고 checked 속성은 변경되지 않습니다. 따라서 확인란을 선택했는지 확인하는 브라우저 간 호환 방법은 속성을 사용하는 것입니다.

아래의 모든 방법이 가능합니다.

elem.checked 

$(elem).prop("checked") 

$(elem).is(":checked") 

ID가있는 체크 박스의 경우

<input id="id_input_checkbox13" type="checkbox"></input>

너는 간단하게 할 수있다.

$("#id_input_checkbox13").prop('checked')

위의 구문에 대한 반환 값으로 true 또는 false 를 얻을 수 있습니다. if 절에서 일반적인 부울 표현식으로 사용할 수 있습니다.


jQuery documentation 따라 체크 박스가 선택되었는지 확인하는 방법은 다음과 같습니다. 예를 들어 체크 박스를 고려해 봅시다 (모든 예제로 jsfiddle 작업 확인)

<input type="checkbox" name="mycheckbox" id="mycheckbox" />
<br><br>
<input type="button" id="test-with-checked" value="Test with checked" />
<input type="button" id="test-with-is" value="Test with is" />
<input type="button" id="test-with-prop" value="Test with prop" />

예 1 - 확인 표시 있음

$("#test-with-checked").on("click", function(){
    if(mycheckbox.checked) {
        alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

예제 2 - jQuery가있는 경우, NOTE - : checked

var check;
$("#test-with-is").on("click", function(){
    check = $("#mycheckbox").is(":checked");
    if(check) {
        alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

예제 3 - jQuery와 함께

var check;
$("#test-with-prop").on("click", function(){
    check = $("#mycheckbox").prop("checked");
    if(check) {
         alert("Checkbox is checked.");
    } else {
        alert("Checkbox is unchecked.");
    }
}); 

jsfiddle 작업 확인


jQuery 코드를 사용하여 체크 박스가 선택되었는지 확인한다.

if($('input[name="checkBoxName"]').is(':checked'))
{
  // checked
}else
{
 // unchecked
}

대안 :

if($('input[name="checkBoxName"]:checked'))
{
    // checked
}else{
  // unchecked
}

나는 그 OP가 jquery를 원한다는 것을 알고 있지만 내 경우 순수한 JS가 대답이었다. 그래서 나와 같은 사람이 jquery가 없거나 그것을 사용하고 싶지 않다면 - 여기 JS 응답이있다.

document.getElementById("myCheck").checked

ID myCheck가 지정된 입력이 선택되면 true를, 선택하지 않으면 false를 리턴합니다.

그처럼 간단합니다.


다음의 모든 방법이 유용합니다.

$('#checkbox').is(":checked")

$('#checkbox').prop('checked')

$('#checkbox')[0].checked

$('#checkbox').get(0).checked

대신 DOMelement 또는 인라인 "this.checked"는 피하는 것이 좋습니다. 메서드의 jQuery는 이벤트 리스너를 사용해야합니다.


실제로 jsperf.com 에 따르면 DOM 작업이 가장 빠르다. $ (). prop () 다음에 $ (). is () !!

구문은 다음과 같습니다.

var checkbox = $('#'+id);
/* OR var checkbox = $("input[name=checkbox1]"); whichever is best */

/* The DOM way - The fastest */
if(checkbox[0].checked == true)
   alert('Checkbox is checked!!');

/* Using jQuery .prop() - The second fastest */
if(checkbox.prop('checked') == true)
   alert('Checkbox is checked!!');

/* Using jQuery .is() - The slowest in the lot */
if(checkbox.is(':checked') == true)
   alert('Checkbox is checked!!');

나는 개인적으로 .prop() 선호한다. .is() 와 달리 값을 설정하는 데 사용할 수도 있습니다.


아래 코드를 사용하십시오.

<script>

$(document).ready(function () {
  $("[id$='chkSendMail']").attr("onchange", "ShowMailSection()");
}

function ShowMailSection() {
  if ($("[id$='chkSendMail'][type='checkbox']:checked").length >0){
      $("[id$='SecEmail']").removeClass("Hide");
  }
</script>

이 코드를 사용하면 다른 체크 박스 그룹 또는 여러 체크 박스에서 하나 이상의 체크 박스가 선택되었는지 여부를 확인할 수 있습니다. 이를 사용하여 ID 또는 동적 ID를 제거 할 필요가 없습니다. 이 코드는 동일한 ID로 작동합니다.

참조 Link

<label class="control-label col-sm-4">Check Box 2</label>
    <input type="checkbox" name="checkbox2" id="checkbox21" value=ck1 /> ck1<br />
    <input type="checkbox" name="checkbox2" id="checkbox22" value=ck2 /> ck2<br />

<label class="control-label col-sm-4">Check Box 3</label>
    <input type="checkbox" name="checkbox3" id="checkbox31" value=ck3 /> ck3<br />
    <input type="checkbox" name="checkbox3" id="checkbox32" value=ck4 /> ck4<br />

<script>
function checkFormData() {
    if (!$('input[name=checkbox2]:checked').length > 0) {
        document.getElementById("errMessage").innerHTML = "Check Box 2 can not be null";
        return false;
    }
    if (!$('input[name=checkbox3]:checked').length > 0) {
        document.getElementById("errMessage").innerHTML = "Check Box 3 can not be null";
        return false;
    }
    alert("Success");
    return true;
}
</script>

이 코드를 사용할 수 있습니다.

if($("#checkboxId").is(':checked')){
     // Code in the case checkbox is checked.
} else {
     // Code in the case checkbox is NOT checked.
}

토글 체크 박스 선택됨

$("#checkall").click(function(){
    $("input:checkbox").prop( 'checked',$(this).is(":checked") );
})

필자의 예제에서 상황은 다이얼로그를 닫기 전에 체크 박스를 확인한 대화 상자였습니다. 위와 jQuery에서 체크 박스가 선택되었는지 확인하는 방법은 무엇입니까? 확인란을 선택하면 jQuery도 작동하지 않는 것 같습니다.

결국

<input class="cb" id="rd" type="checkbox">
<input class="cb" id="fd" type="checkbox">

var fd=$('.cb#fd').is(':checked');
var rd= $('.cb#rd').is(':checked');

이것은 클래스를 호출 한 다음 ID를 호출합니다. ID가 아니라 이 페이지의 중첩 된 DOM 요소로 인해 문제가 발생한 것일 수 있습니다. 해결 방법은 위에 나와 있습니다.


$('#' + id).is(":checked")

확인란을 선택하면됩니다.

동일한 이름을 가진 체크 박스의 배열을 보려면 다음 방법으로 체크 된 것들의 목록을 얻을 수 있습니다 :

var $boxes = $('input[name=thename]:checked');

그런 다음 루프를 통해 확인 된 내용을 확인하십시오.

$boxes.each(function(){
    // Do stuff here with this
});

확인 된 사용자 수를 확인하려면 다음을 수행하십시오.

$boxes.length;

$('#checkbox').is(':checked'); 

위의 코드는 확인란이 선택되어 있으면 true를 반환하고 그렇지 않으면 false를 반환합니다.







checkbox