jQuery, 확인란 및 .is(": 선택됨")

jQuery, 확인란 및 .is(": 선택됨")

다음과 같은 확인란 요소에 함수를 바인딩하는 경우:

$("#myCheckbox").click( function() {
    alert($(this).is(":checked"));
});

이 확인란은 이벤트가 트리거되기 전에 선택된 특성을 변경합니다. 이 특성은 정상 동작이며 역 결과를 제공합니다.

하지만, 내가 할 때:

$("#myCheckbox").click();

이 확인란은 이벤트가 트리거된 후 선택한 특성을 변경합니다.

제 질문은 일반적인 클릭처럼 jQuery에서 클릭 이벤트를 트리거하는 방법이 있습니까(첫 번째 시나리오)?

PS: 이미 시도했습니다.trigger('click');

$('#myCheckbox').change(function () {
    if ($(this).prop("checked")) {
        // checked
        return;
    }
    // not checked
});

참고: 이전 버전의 jquery에서는 사용해도 괜찮았습니다.attr이제 상태를 읽을 때 사용하는 것이 좋습니다.

jQuery 1.3.2 및 1.4.2에서 작동하는 해결 방법이 있습니다.

$("#myCheckbox").change( function() {
    alert($(this).is(":checked"));
});

//Trigger by:
$("#myCheckbox").trigger('click').trigger('change');​​​​​​​​​​​​​

하지만 저는 동의합니다, 이 행동은 토착적인 행사와 비교해 볼 때 버그가 있는 것 같습니다.

2016년 6월 현재(jquery 2.1.4 사용) 다른 제안 솔루션은 작동하지 않습니다.확인 중attr('checked')항상 되돌아옴undefined그리고.is('checked)항상 되돌아옴false.

프롭 방법을 사용하면 됩니다.

$("#checkbox").change(function(e) {

  if ($(this).prop('checked')){
    console.log('checked');
  }
});

jQuery 1.7.2에서 여전히 이 동작을 경험하고 있습니다.간단한 해결 방법은 setTimeout으로 클릭 핸들러의 실행을 연기하고 그 동안 브라우저가 마법을 수행하도록 하는 것입니다.

$("#myCheckbox").click( function() {
    var that = this;
    setTimeout(function(){
        alert($(that).is(":checked"));
    });
});

이러한 원치 않는 동작이 예상되는 경우에는 jQuery.trigger()에서 확인란의 클릭 핸들러로 추가 매개 변수를 전달하는 것이 좋습니다.이 추가 매개 변수는 사용자가 확인란 자체를 직접 클릭하는 대신 클릭이 프로그래밍 방식으로 트리거되었음을 클릭 핸들러에 알리기 위한 것입니다.그러면 확인란의 클릭 핸들러가 보고된 확인 상태를 반전시킬 수 있습니다.

ID가 "myCheckBox"인 확인란에서 클릭 이벤트를 트리거하는 방법은 다음과 같습니다.또한 단일 멤버인 nonUI로 객체 매개 변수를 전달하고 있으며, 이 매개 변수는 true로 설정되어 있습니다.

$("#myCheckbox").trigger('click', {nonUI : true})

확인란의 클릭 이벤트 핸들러에서 처리하는 방법은 다음과 같습니다.핸들러 함수는 비-벡터의 존재를 확인합니다.UI 개체를 두 번째 매개 변수로 지정합니다. (첫 번째 매개 변수는 항상 이벤트 자체입니다.)파라미터가 존재하고 true로 설정되어 있으면 reported.checked 상태를 반전합니다.사용자가 UI에서 확인란을 클릭하기만 하면 해당 매개 변수가 전달되지 않는 경우 실제 .checked 상태를 보고합니다.

$("#myCheckbox").click(function(e, parameters) {
   var nonUI = false;
        try {
            nonUI = parameters.nonUI;
        } catch (e) {}
        var checked = nonUI ? !this.checked : this.checked;
        alert('Checked = ' + checked);
    });

http://jsfiddle.net/BrownieBoy/h5mDZ/ 의 JSFidle 버전

Chrome, Firefox 및 IE 8로 테스트했습니다.

<input id="widget-wpb_widget-3-custom_date" class="mycheck" type="checkbox" value="d/M/y" name="widget-wpb_widget[3][custom_date]" unchecked="true">    

var atrib = $('.mycheck').attr("unchecked",true);
$('.mycheck').click(function(){
if ($(this).is(":checked")) 
{
$('.mycheck').attr("unchecked",false);
   alert("checkbox checked");
}
else
{
$('.mycheck').attr("unchecked",true);
 alert("checkbox unchecked");
}
});

$("#personal").click(function() {
      if ($(this).is(":checked")) {
            alert('Personal');
        /* var validator = $("#register_france").validate(); 
        validator.resetForm(); */
      }
            }
            );

JSFIDDLE

  $("#checkbox").change(function(e) {

  if ($(this).prop('checked')){
    console.log('checked');
  }
});

첫 번째 시나리오와 일치하도록, 이것이 제가 생각해낸 것입니다.

http://jsbin.com/uwupa/edit

기본적으로 "클릭" 이벤트를 바인딩하는 대신 "변경" 이벤트를 알림과 바인딩합니다.

그런 다음 이벤트를 트리거할 때 먼저 클릭을 트리거한 다음 변경을 트리거합니다.

닉 크레이버의 대답 외에도, 이것이 제대로 작동하기 위해서는.IE 8확인란에 추가 클릭 핸들러를 추가해야 합니다.

// needed for IE 8 compatibility
if ($.browser.msie)
    $("#myCheckbox").click(function() { $(this).trigger('change'); });

$("#myCheckbox").change( function() {
    alert($(this).is(":checked"));
});

//Trigger by:
$("#myCheckbox").trigger('click').trigger('change');

잃었을 .IE 8에서는 확인란 및 라디오를 클릭할 때 해당 확인란과 라디오에 계속 초점을 맞춥니다.

_{에서 테스트하지 IE 9그래도.}

$( "#checkbox" ).change(function() {
    if($(this).is(":checked")){
        alert('hi');
    }

});

가장 빠르고 쉬운 방법:

$('#myCheckbox').change(function(){
    alert(this.checked);
});

---

$el[0].checked;

$el - 선택 항목의 jquery 요소입니다.

맛있게 드세요!

if ($.browser.msie) {
    $("#myCheckbox").click(function() { $(this).trigger('change'); });
}

$("#myCheckbox").change(function() {
        alert($(this).is(":checked"));
    });

언급URL : https://stackoverflow.com/questions/2660323/jquery-checkboxes-and-ischecked