복붙노트

[JQUERY] 체크 박스가 jQuery를 함께 선택되어 있는지 확인

JQUERY

체크 박스가 jQuery를 함께 선택되어 있는지 확인

해결법

  1. 1.ID는이 작업을 수행하지 않아야한다는 것을 의미 문서에서 고유해야합니다 :

    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;

  2. 2.

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

    확인란이 선택된 경우 그 가져옵니다.

    같은 이름을 가진 체크 박스의 배열을 위해 당신은에 의해 확인 것들의 목록을 얻을 수 있습니다 :

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

    그리고 그들을 통해 루프의 당신이 할 수있는 선택을 확인 :

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

    당신이 할 수있는 체크 얼마나 많은 찾으려면 :

    $boxes.length;

  3. 3.

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

    체크 박스 사실 위의 코드 반환 확인 여부를 경우는 false 경우.

  4. 4.모든 다음과 같은 방법이 유용합니다 :

    모든 다음과 같은 방법이 유용합니다 :

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

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

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

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

    DOMelement 또는 인라인 사용 이벤트 리스너해야한다 방법에 jQuery를 대신 피해야한다 "this.checked"하는 것이 좋습니다.

  5. 5.jQuery 코드는 체크 박스 체크 여부 확인 :

    jQuery 코드는 체크 박스 체크 여부 확인 :

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

    또한 :

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

  6. 6.모든 아래의 방법이 가능하다

    모든 아래의 방법이 가능하다

    elem.checked 

$(elem).prop("checked") 

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

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

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

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

  8. 8.JQuery와 문서에 따라 체크 박스에 체크 여부되어 있는지 확인하는 방법이 따르고 있습니다. 예를 들어, 체크 박스를 고려하자 (모든 예제와 함께 작동 jsfiddle을 확인)

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

    jQuery를은으로, 주 - - 예 2 : 확인

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

  9. 9.이 시도 할 수 있습니다 :

    이 시도 할 수 있습니다 :

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

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

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

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

    확인하면, 1 돌아갑니다; 그렇지 않으면 0을 반환 할 수 있습니다.

  11. 11.나는 영업 찾는 jQuery를 알고 있지만 내 경우에는 순수 JS 나 같은 사람이 여기 그렇다면 대답했다 및 jQuery를 가지고 있지 않거나 사용하지 않으려는 - 여기에 JS의 대답은 :

    나는 영업 찾는 jQuery를 알고 있지만 내 경우에는 순수 JS 나 같은 사람이 여기 그렇다면 대답했다 및 jQuery를 가지고 있지 않거나 사용하지 않으려는 - 여기에 JS의 대답은 :

    document.getElementById("myCheck").checked

    이 선택하지 않은 경우 ID myCheck와 입력을 선택하고 false 인 경우는 true를 돌려줍니다.

    그렇게 단순.

  12. 12.당신은 JQuery와에 의해 다음과 같은 권장 코드 중 하나를 사용할 수 있습니다.

    당신은 JQuery와에 의해 다음과 같은 권장 코드 중 하나를 사용할 수 있습니다.

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

  13. 13.당신은 단순히처럼 그것을 할 수 있습니다;

    당신은 단순히처럼 그것을 할 수 있습니다;

    작업 바이올린

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

    확인란이 사실 반환을 선택하면 정의되지 않은

  14. 14.확인하고 체크 박스를 설정하는 간단한 데모.

    확인하고 체크 박스를 설정하는 간단한 데모.

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

  15. 15.그냥 상황이 다음 대화 상자를 닫기 전에 체크 박스를 확인하는 대화 상자이었다 내 예에 대답. 체크 박스가 jQuery를 체크 여부를 위 방법 중 어느 것도 확인 없습니다? 및 jQuery를 체크 박스 중 하나가 작동을하지 않은 것으로 보입니다 체크합니다.

    그냥 상황이 다음 대화 상자를 닫기 전에 체크 박스를 확인하는 대화 상자이었다 내 예에 대답. 체크 박스가 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 요소 때문일 수 있습니다. 해결 방법은 위였다.

  16. 16.ID가 체크 박스

    ID가 체크 박스

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

    당신은 간단하게 할 수있는

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

    당신은 위의 구문에 대한 반환 값으로 true 또는 false 얻을 것이다. 당신은 정상 부울 표현으로하면 절에 사용할 수 있습니다.

  17. 17.이 캔 도움이 비슷해

    이 캔 도움이 비슷해

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

  18. 18.사실, jsperf.com에 따르면, DOM 작업이 다음 $, 가장 빠르다 (). $ 다음에 소품을 () (). ()에!

    사실, jsperf.com에 따르면, DOM 작업이 다음 $, 가장 빠르다 (). $ 다음에 소품을 () (). ()에!

    여기 구문은 다음과 같습니다 :

    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 선호 (). 달리 네 질병 ()는, 또한 값을 설정하기 위해 사용될 수있다.

  19. 19.전환 확인란이 선택

    전환 확인란이 선택

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

  20. 20.당신은 적어도 하나의 확인란이 선택되어 있는지 확인 여부를 다른 체크 박스 그룹 또는 여러 개의 체크 박스에서 수이 코드를 사용하여. 이 사용하면 ID 또는 동적 ID를 제거 할 필요가 없습니다. 같은 ID를 가진이 코드는 작동합니다.

    당신은 적어도 하나의 확인란이 선택되어 있는지 확인 여부를 다른 체크 박스 그룹 또는 여러 개의 체크 박스에서 수이 코드를 사용하여. 이 사용하면 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>

  21. 21.이 중반 2019 그리고 jQuery를 때때로 VueJS 같은 것들에 뒤 자리를 걸리므로, 여기에 자바 스크립트가 리스너 옵션 온로드 순수한 바닐라의 등 반작용 :

    이 중반 2019 그리고 jQuery를 때때로 VueJS 같은 것들에 뒤 자리를 걸리므로, 여기에 자바 스크립트가 리스너 옵션 온로드 순수한 바닐라의 등 반작용 :

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

  22. 22.귀하의 질문은 명확하지 않다 : 당신은 출력에서 ​​참 /의 거짓을 입력에서 "체크 박스 배열 ID"를주고 싶어 - 당신이 체크 된 체크 박스를 알 수 없습니다이 방법으로 (함수 이름으로 제안). 그래서 아래에 입력 걸릴 체크 박스 ID를 출력 리턴 참 / 거짓의에 (아주 간단하지만 ID 키워드 안) 당신의 isCheckedById의 몸의 내 제안이,

    귀하의 질문은 명확하지 않다 : 당신은 출력에서 ​​참 /의 거짓을 입력에서 "체크 박스 배열 ID"를주고 싶어 - 당신이 체크 된 체크 박스를 알 수 없습니다이 방법으로 (함수 이름으로 제안). 그래서 아래에 입력 걸릴 체크 박스 ID를 출력 리턴 참 / 거짓의에 (아주 간단하지만 ID 키워드 안) 당신의 isCheckedById의 몸의 내 제안이,

    this[id].checked

    함수 isCheckedById (ID) { 이 [ID]를 .checked를 리턴; } 기능 체크 () { console.clear () CONSOLE.LOG ( '1', isCheckedById ( "myCheckbox1")); CONSOLE.LOG ( '2', isCheckedById ( "myCheckbox2")); CONSOLE.LOG ( '3', isCheckedById ( "myCheckbox3")); } <라벨> <입력 ID = "myCheckbox1"TYPE = "체크 박스"> 체크 1 <라벨> <입력 ID = "myCheckbox2"TYPE = "체크 박스"> 확인 2 <라벨> <입력 ID = "myCheckbox3"TYPE = "체크 박스"> 확인 3 로
    <버튼의 onclick = "체크 ()"> 쇼 선택

  23. 23.아래의 코드를 사용

    아래의 코드를 사용

    <script>

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

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

    24. from https://stackoverflow.com/questions/2204250/check-if-checkbox-is-checked-with-jquery by cc-by-sa and MIT license

'JQUERY' 카테고리의 다른 글

[JQUERY] 왜 나는 옵션을 GET 요청 대신 요구는 무엇입니까?  (0) 2020.09.25
[JQUERY] 어떻게 jQuery를 사용하여 알파벳 순으로 목록을 정렬 할 수 있습니다?  (0) 2020.09.24
[JQUERY] 어떻게 데이터 id 속성을 얻으려면?  (0) 2020.09.24
[JQUERY] 어떻게 16 진수 색상 값이 아닌 RGB 값을 얻을 수 있습니까?  (0) 2020.09.24
[JQUERY] jQuery를 게시 JSON  (0) 2020.09.24
,

티스토리툴바