问题
I used "iCheck jQuery" to modificate the style of the checkbox. But when i add a iCheck script - my onlick metod stops working. Why it happening?
<input id="my_cb" type="checkbox" value="yes_n" onclick="hide_row_metod()"/>
<script>
$(document).ready(function(){
$('#my_cb').iCheck({
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%' // optional
});
});
</script>
My script:
<script>
function hide_row_metod() {
if(document.getElementById('my_cb').checked){
document.getElementById('row1').style.display = "none";
}else{
document.getElementById('row1').style.display = "inline";
}
}
</script>
回答1:
iCheck registers custom events you can listen for. I put up a working example on jsbin, the main difference is this:
$("#my_cb").on("ifChanged", hide_row_metod);
There are two events: ifChecked and ifUnchecked. If you want to catch all changes to your checkbox, you need to either listen for both or simply listen for ifChanged
. This will work to toggle the row, as you are testing for checked
in your hide_row_metod
.
In my example, I use a block element div#row1
, so it will render differently (inline
) after checking and unchecking.
Also: you got a typo in your method name (missing h
).
回答2:
I know it's been some time since this question has been asked. I've made a script to capture onclick attribute from each radio / checkbox and attach it to its corresponding iCheck / iRadio. Just remember to run it AFTER iCheck has been applied. Set a timeout or run it after iCheck's implementation:
$("[class*='icheckbox'],[class*='iradio']").each(function(){
$(this).find("ins").attr("onclick", $(this).find("input").attr("onclick"));
});
回答3:
It is probably overridden by the iCheck
script. Try using only jQuery:
$('#my_cb').on('click', function() {
$('#row1').css('display', this.checked ? 'none' : 'inline');
});
来源:https://stackoverflow.com/questions/28138043/icheck-jquery-blocks-custom-script