developer tip

jquery를 사용하여 확인란을 선택 / 선택 취소 하시겠습니까?

copycodes 2020. 10. 3. 10:59
반응형

jquery를 사용하여 확인란을 선택 / 선택 취소 하시겠습니까? [복제]


이 질문에 이미 답변이 있습니다.

내 페이지에 일부 입력 텍스트 필드가 있으며 JavaScript를 사용하여 해당 값을 표시하고 있습니다.

.set("value","")값을 편집하고, 추가 확인란 필드를 추가하고, 값을 전달하는 기능을 사용 하고 있습니다.

여기서 value == 1이면이 확인란이 선택 되어 있는지 확인하고 싶습니다 . 그렇지 않으면 선택되지 않은 상태로 유지되어야합니다.

두 개의 div를 사용하여이 작업을 수행했지만 그게 불편합니다. 다른 해결책이 있습니까?

if(value == 1) {
    $('#uncheck').hide();
    $('#check').show();
} else{
    $('#uncheck').show();
    $('#check').hide();
}

jQuery 1.6 이상 :

.attr () 은 속성에 대해 더 이상 사용되지 않습니다. 대신 .prop () 함수를 다음과 같이 사용하십시오.

$('#myCheckbox').prop('checked', true); // Checks it
$('#myCheckbox').prop('checked', false); // Unchecks it

jQuery <1.6의 경우 :

확인란을 선택 / 선택 취소하려면 속성을 사용 checked하고 변경하십시오. jQuery를 사용하면 다음을 수행 할 수 있습니다.

$('#myCheckbox').attr('checked', true); // Checks it
$('#myCheckbox').attr('checked', false); // Unchecks it

HTML에서는 다음과 같이 보일 것입니다.

<input type="checkbox" id="myCheckbox" checked="checked" /> <!-- Checked -->
<input type="checkbox" id="myCheckbox" /> <!-- Unchecked -->

그러나 .attr () 메서드를 신뢰하여 확인란 값을 가져올 수는 없습니다 (필요한 경우). .prop () 메서드 를 사용해야합니다 .


이를 위해 prop ()사용할 수 있습니다. jQuery 1.6 이전 에는 .attr () 메서드가 일부 속성을 검색 할 때 속성 값을 고려하여 일관성없는 동작을 유발할 수 있습니다. jQuery를 1.6으로.prop()방법은 있지만, 명시 적으로 속성 값을 검색 할 수있는 방법을 제공 .attr()를 검색 특성을가집니다.

var prop=false;
if(value == 1) {
   prop=true; 
}
$('#checkbox').prop('checked',prop);

또는 간단히

$('#checkbox').prop('checked',(value == 1));

단편

$(document).ready(function() {
  var chkbox = $('.customcheckbox');
  $(".customvalue").keyup(function() {
    chkbox.prop('checked', this.value==1);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h4>This is a domo to show check box is checked
if you enter value 1 else check box will be unchecked </h4>
Enter a value:
<input type="text" value="" class="customvalue">
<br>checkbox output :
<input type="checkbox" class="customcheckbox">


값에 따라 확인란의 상태를 설정할 수 있습니다.

$('#your-checkbox').prop('checked', value == 1);

참고URL : https://stackoverflow.com/questions/17420534/check-uncheck-checkbox-using-jquery

반응형