함수를 다음과 같은 확인란 요소에 바인딩 할 때 :
$("#myCheckbox").click( function() {
alert($(this).is(":checked"));
});
체크 박스 는 이벤트가 트리거 되기 전에 체크 된 속성을 변경합니다 . 이것은 정상적인 동작이며 반대 결과를 제공합니다.
그러나 내가 할 때 :
$("#myCheckbox").click();
확인란 은 이벤트가 트리거 된 후 확인 된 속성 을 변경합니다 .
내 질문은 일반적인 클릭처럼 jQuery에서 클릭 이벤트를 트리거하는 방법이 있습니까 (첫 번째 시나리오)?
추신 : 나는 이미 시도했습니다 trigger('click')
;
답변
답변
답변
2016 년 6 월 현재 (jquery 2.1.4 사용) 다른 제안 된 솔루션은 작동하지 않습니다. 확인은 attr('checked')
항상 반환 undefined
하고 is('checked)
항상 반환합니다 false
.
prop 메소드를 사용하십시오.
$("#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”인 확인란에서 클릭 이벤트를 트리거하는 방법은 다음과 같습니다. 또한 true로 설정된 단일 멤버 인 nonUI를 사용하여 개체 매개 변수를 전달하고 있습니다.
$("#myCheckbox").trigger('click', {nonUI : true})
체크 박스의 클릭 이벤트 핸들러에서이를 처리하는 방법은 다음과 같습니다. 핸들러 함수는 두 번째 매개 변수로 nonUI 객체의 존재를 확인합니다. (첫 번째 매개 변수는 항상 이벤트 자체입니다.) 매개 변수가 존재하고 true로 설정되면보고 된 .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/의 JSFiddle 버전
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");
}
});
답변
$("#checkbox").change(function(e) {
if ($(this).prop('checked')){
console.log('checked');
}
});