[英]iCheck check if checkbox is checked
我正在使用 iCheck 插件来自定义复选框。 我需要在选中一个或多个复选框时显示某些文本,并在未选中任何复选框时隐藏文本。
我目前拥有的代码在第一次单击时显示文本,但除非我再单击 2 次,否则不会隐藏它。 我有多个复选框,如果其中一个被选中,我想显示文本,否则隐藏文本。 有人有任何想法吗? 该插件具有:
ifChecked
ifChanged
ifClicked
ifUnchecked
ifToggled
ifDisabled
ifEnabled.......
回调......这是插件功能
$('input').iCheck({
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%' // optional
});
这是我尝试过的..
$('input').on('ifChecked', function(event){
$(".hide").toggle();
});
html
<input type="checkbox">
<div class"hide" style="display:none">Hi there</div>
对于那些为此而苦苦挣扎的人:
const value = $('SELECTOR').iCheck('update')[0].checked;
这直接返回true
或false
作为boolean
。
您可以通过以下方式获取复选框和状态的值
$('.i-checks').on('ifChanged', function(event) {
alert('checked = ' + event.target.checked);
alert('value = ' + event.target.value);
});
检查这个:
var checked = $(".myCheckbox").parent('[class*="icheckbox"]').hasClass("checked");
if(checked) {
//do stuff
}
此处记录了所有回调和函数: http : //fronteed.com/iCheck/#usage
$('input').iCheck('check'); — change input's state to checked
$('input').iCheck('uncheck'); — remove checked state
$('input').iCheck('toggle'); — toggle checked state
$('input').iCheck('disable'); — change input's state to disabled
$('input').iCheck('enable'); — remove disabled state
$('input').iCheck('indeterminate'); — change input's state to indeterminate
$('input').iCheck('determinate'); — remove indeterminate state
$('input').iCheck('update'); — apply input changes, which were done outside the plugin
$('input').iCheck('destroy'); — remove all traces of iCheck
您只需要从文档中使用回调: https : //github.com/fronteed/iCheck#callbacks
$('input').on('ifChecked', function(event){
alert(event.type + ' callback');
});
要知道是否选中了 iCheck 框
var isChecked = $("#myicheckboxid").prop("checked");
我写了一些简单的东西:
当您将icheck
初始化为:
$('input').iCheck({
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%' // optional
});
在其下添加以下代码:
$('input').on('ifChecked', function (event){
$(this).closest("input").attr('checked', true);
});
$('input').on('ifUnchecked', function (event) {
$(this).closest("input").attr('checked', false);
});
在此之后,您可以轻松找到原始复选框的状态。 我写了这个代码使用icheck
在gridView
和C#访问从服务器端的状态。
只需从其id 中找到您的复选框。
将此代码用于 iCheck:
$('.i-checks').iCheck({
checkboxClass: 'icheckbox_square-green',
radioClass: 'iradio_square-green',
}).on('ifChanged', function(e) {
// Get the field name
var isChecked = e.currentTarget.checked;
if (isChecked == true) {
}
});
打电话
element.iCheck('update');
获取元素上的更新标记
使用以下代码检查是否使用单一方法检查 iCheck。
$('Selector').on('ifChanged', function(event){
//Check if checkbox is checked or not
var checkboxChecked = $(this).is(':checked');
if(checkboxChecked) {
alert("checked");
}else{
alert("un-checked");
}
});
$('input').on('ifChanged', function(event) {
if($(".checkbox").is(":checked")) {
$value = $(this).val();
}
else if($(".checkbox").is(":not(:checked)")) {
$value= $(this).val();
}
});
使用这个方法:
$(document).on('ifChanged','SELECTOR', function(event){
alert(event.type + ' callback');
});
如果有人对多个icheck()感兴趣。 然后,您可以使用以下方法进行操作:
$("#mother_checkbox").on("ifChanged", function(){
if($(this).is(':checked')) {
$('.child_checkbox').prop('checked', true);
$('.child_checkbox').iCheck('update');
}
else{
$('.child_checkbox').prop('checked', false);
$('.child_checkbox').iCheck('update');
}
});
它将选中/取消选中所有子复选框。 美好的一天!
这对我有用......试试吧
// Check #x $( "#x" ).prop( "checked", true ); // Uncheck #x $( "#x" ).prop( "checked", false );
您可以将所有复选框包装在父类中并检查.checked
..
if( $('.your-parent-class').find('.checked').length ){
$(".hide").toggle();
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.