jQuery로 확인란이 선택되어 있는지 확인하십시오.

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

다음 코드를 사용하고 있지만 ID에 관계없이 항상 확인란의 수를 반환합니다.

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

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

ID는 문서에서 고유해야합니다. 즉, 이렇게하면 안됩니다 .

<input type="checkbox" name="chk[]" id="chk[]" value="Apples" />
<input type="checkbox" name="chk[]" id="chk[]" value="Bananas" />

대신 ID를 삭제 한 다음 이름 또는 포함 요소로 선택하십시오.

<fieldset id="checkArray">
    <input type="checkbox" name="chk[]" value="Apples" />

    <input type="checkbox" name="chk[]" value="Bananas" />
</fieldset>

그리고 이제 jQuery :

var atLeastOneIsChecked = $('#checkArray:checkbox:checked').length > 0;
//there should be no space between identifier and selector

// or, without the container:

var atLeastOneIsChecked = $('input[name="chk[]"]:checked').length > 0;

$('#' + 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').is(":checked")

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

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

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

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

확인란이 선택되어 있는지 여부를 확인하는 jQuery 코드 :

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

또는

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

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

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

elem.checked 

$(elem).prop("checked") 

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

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

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

jQuery 문서에 따라 확인란을 선택했는지 여부를 확인하는 방법은 다음과 같습니다. 예를 들어 확인란을 고려하십시오 ( 모든 예제에서 작동하는 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 prop 사용

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

작동하는 jsfiddle 확인

당신은 이것을 시도 할 수 있습니다 :

<script>
function checkAllCheckBox(value)
{
   if($('#select_all_').is(':checked')){
   $(".check_").attr ( "checked" ,"checked" );
    }
    else
    {
        $(".check_").removeAttr('checked');
    }

 }

</script>
<input type="checkbox" name="chkbox" id="select_all_" value="1" />


<input type="checkbox" name="chkbox" class="check_" value="Apples" />
<input type="checkbox" name="chkbox" class="check_" value="Bananas" />
<input type="checkbox" name="chkbox" class="check_" value="Apples" />
<input type="checkbox" name="chkbox" class="check_" value="Bananas" />

jquery에서 다음 권장 코드 중 하나를 사용할 수 있습니다.

if ( elem.checked ) {};
if ( $( elem ).prop( "checked" ) ) {};
if ( $( elem ).is( ":checked" ) ) {};

OP가 jquery를 원한다는 것을 알고 있지만 내 경우에는 순수한 JS가 답이므로 나와 같은 사람이 여기 있고 jquery가 없거나 사용하지 않으려는 경우 JS 답변이 있습니다.

document.getElementById("myCheck").checked

ID가 myCheck 인 입력을 확인하면 true를, 확인하지 않으면 false를 반환합니다.

그렇게 간단합니다.

당신은 간단하게 그것을 할 수 있습니다;

일 바이올린

HTML

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

jQuery

$(document).ready(function () {
    var ckbox = $('#checkbox');

    $('input').on('click',function () {
        if (ckbox.is(':checked')) {
            alert('You have Checked it');
        } else {
            alert('You Un-Checked it');
        }
    });
});

또는 더 간단합니다.

$("#checkbox").attr("checked") ? alert("Checked") : alert("Unchecked");

를 checkbox선택하면 true그렇지 않으면 반환 됩니다undefined

이것은 또한 내가 자주 사용하는 아이디어입니다.

var active = $('#modal-check-visible').prop("checked") ? 1 : 0 ;

씹으면 1을 반환합니다. 그렇지 않으면 0을 반환합니다.

확인란을 확인하고 설정하기위한 간단한 데모.

jsfiddle !

$('.attr-value-name').click(function() {
    if($(this).parent().find('input[type="checkbox"]').is(':checked'))
    {
        $(this).parent().find('input[type="checkbox"]').prop('checked', false);
    }
    else
    {
        $(this).parent().find('input[type="checkbox"]').prop('checked', true);
    }
});

내 예에서 말하자면 상황은 대화 상자이며 대화 상자를 닫기 전에 확인란을 확인했습니다. 위의 어느 것도 없으며 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가있는 확인란의 경우

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

당신은 단순히 할 수 있습니다

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

위의 구문에 대한 반환 값을 얻 true거나 얻을 수 false있습니다. if 절에서 일반 부울 식으로 사용할 수 있습니다.

이와 같은 것이 도움이 될 수 있습니다

togglecheckBoxs =  function( objCheckBox ) {

    var boolAllChecked = true;

    if( false == objCheckBox.checked ) {
        $('#checkAll').prop( 'checked',false );
    } else {
        $( 'input[id^="someIds_"]' ).each( function( chkboxIndex, chkbox ) {
            if( false == chkbox.checked ) {
                $('#checkAll').prop( 'checked',false );
                boolAllChecked = false;
            }
        });

        if( true == boolAllChecked ) {
            $('#checkAll').prop( 'checked',true );
        }
    }
}

실제로 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()값을 설정하는 데에도 사용할 수 있습니다.

체크 박스 전환 체크

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

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

참조 링크

<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>

2019 년 중반부터 jQuery는 VueJS, React 등과 같은 것들에 뒤지지 않습니다. 순수한 바닐라 자바 ​​스크립트 onload 리스너 옵션은 다음과 같습니다.

<script>
  // Replace 'admincheckbox' both variable and ID with whatever suits.

  window.onload = function() {
    const admincheckbox = document.getElementById("admincheckbox");
    admincheckbox.addEventListener('click', function() {
      if(admincheckbox.checked){
        alert('Checked');
      } else {
        alert('Unchecked');
      }
    });
  }
</script>

귀하의 질문은 분명하지 않습니다 : 입력시 "확인란 배열 ID"를 제공하고 true/false출력을 얻으려고합니다 .이 방법으로 (함수 이름에서 알 수 있듯이) 어떤 확인란이 선택되었는지 알 수 없습니다. 아래에는 isCheckedById입력시 체크 박스 id와 출력 반환시 본문이 제안되어 있습니다 true/false(매우 간단하지만 ID는 키워드가 아니어야 함),

this[id].checked

function isCheckedById(id) {
  return this[id].checked;
}

function check() {
  console.clear()
  console.log('1',isCheckedById("myCheckbox1"));
  console.log('2',isCheckedById("myCheckbox2"));
  console.log('3',isCheckedById("myCheckbox3"));
}

<label><input id="myCheckbox1" type="checkbox">check 1</label>
<label><input id="myCheckbox2" type="checkbox">check 2</label>
<label><input id="myCheckbox3" type="checkbox">check 3</label>
<!-- label around inputs makes text clickable -->
<br>
<button onclick="check()">show checked</button>

아래 코드를 사용하십시오

<script>

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

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