jQuery 체크 박스 선택 및 자바 스크립트 onclick 이벤트 트리거

Question

jQuery를 사용하여 확인란을 선택하고 프로세스에서 onclick 이벤트를 트리거하려고합니다.

<input type="checkbox" value="checked" name="check1" onclick="alert(this.value);"> 

그리고 함수에 트리거되는 jQuery를 문이 : 확인란이 선택됩니다

$('input[name=check1]').attr('checked', true); 

결과는되지만 자바 스크립트를

내가 HTML에 정의 된 확인란을 말해봐 onclick 이벤트가 트리거되지 않습니다. 따라서 경고가 표시되지 않습니다. 내가 였다면 같은 경우에도 수동으로 클릭을 유발하기 :

$('input[name=check1]').attr('checked', true).trigger('click'); 

결과는 트리거의 onclick 자바 스크립트 이벤트 확인됩니다 체크 박스, (그리고 값을 제대로 받고있다)하지만 체크 박스는 그 후 선택 취소됩니다.

내가 할 일을 어떻게 달성 할 수 있는지 누가 알 수 있습니까?

Answer 1

사용 .triggerHandler() 대신 .trigger() :

이

$('input[name=check1]').attr('checked', true).triggerHandler('click'); 

또한, .prop() 대신 .attr() 사용 (. 당신이 jQuery를 1.6 이상을 사용하는 경우)

$('input[name=check1]').prop('checked', true).triggerHandler('click'); 

을 편집 또한 —, 다른 대답에 대해 주석을 달았으므로 프로그래밍 방식으로 이벤트를 트리거 할 때 jQuery의 이상한 동작을주의해야합니다. Here is an illustrative jsfiddle. 요소에서 실제 "클릭"이 발생하면 요소의 "클릭"처리기에 "checked"플래그의 업데이트 된 값이 표시됩니다. 즉, 선택하지 않은 체크 상자를 클릭하면 클릭 핸들러에 true으로 설정된 "checked"플래그가 표시됩니다. 그러나 jQuery를 통해 체크되지 않은 체크 박스에서 "클릭"을 트리거하면 "클릭"핸들러가 false으로 설정된 "checked"플래그를 볼 것입니다! 그건 내 생각에 정말 나쁜 것입니다. 그러나 항상 그렇게합니다.

편집 다시 — 오, 또한, 내가 잊고 또 다른 중요한 (자극적)의 jQuery 불확실성 : 알 수없는 이유로 들어, .triggerHandler() API 만 첫 번째 일치하는 요소에 처리기를 호출합니다. 당신은 모든 체크 박스를 실행하려고하면 즉 핸들러, "클릭"

$('input:checkbox').triggerHandler('click'); 

다음 페이지의 첫 번째 체크 박스가 트리거됩니다.

$('input:checkbox').bind('click my-click', function() ...) // or ".on()" with 1.7 

내가 트리거 "내 클릭"과의 최선을 얻을 수있는 그런 식 : 내가 일반적으로 광기에 대처하기 위해 할 내 자신의 가짜 이벤트 이름과 처리기를 바인딩뿐만 아니라 "클릭"입니다 두 세계 : 라이브러리가 의 핸들러를 모두 트리거합니다. 일치하는 요소는이지만 요소의 실제 상태는 전환되지 않습니다.

Answer 2

변경 :

$('input[name=check1]').attr('checked', true).trigger('click'); 

사람 :

$('input[name=check1]').trigger('click').prop('checked', true); 

Answer 3

this answer은 잘 작동하는 것 같다 :

$('input[name=check1]').attr('checked', true).change();

jsFiddle demo

Answer 4

.on('changed', ...)은 확실히 체크 박스 요소에 바인딩해야합니다 (훨씬 더 합리적으로 동작합니다). 그런 다음 상태를 토글하여 원하는 이벤트 트리거를 확인하려는 요소에서 .click()을 수동으로 트리거 할 수 있습니다 (해당 핸들러가 본 내용과 일치하는 상태의 DOM 참조).

<input type="checkbox" value="checked" name="check1"> 
<script> 
    $('input').on('change', function(e) {alert(e.target.value);}); 
    $('input').click(); 
    // see the alert, and if you checked $(e.target).is(':checked') you should get true 
</script>