Pet*_*tee 15 checkbox jquery internet-explorer hidden label
我在查看IE中隐藏的复选框时遇到问题.这是基础html:
<input id="groups_ids_1" name="group_ids[]" type="checkbox" value="1" />
<label for="groups_ids_1">Display</label>
这工作正常,但如果我然后使用其中任何一个隐藏复选框
$('input[type=checkbox]').hide();
要么
$('input[type=checkbox]').css('visibility', 'hidden');
单击标签不再检查IE中的复选框.当然它在Firefox,Chrome和Safari中运行良好.
Mar*_*elm 13
隐藏的复选框不会在IE 9以下的版本中收到事件.我的通用解决方案如下:
/* hide checkboxes */
input[type=checkbox] {
visibility: hidden;
position: absolute; /* move out of document flow */
}
/* ie8-: hidden inputs don't receive events, move out of viewport */
.lt-ie9 input[type=checkbox] {
visibility: visible;
top: -50px;
}
当输入获得焦点时,请勿将输入移动到左侧,否则页面将在IE中跳转!.lt-ie8是以这种方式在旧IE版本的HTML标记上设置的类:(参见例如:https://github.com/h5bp/html5-boilerplate/blob/master/index.html)
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
但是,您可以使用首选方法将第二个规则中的属性仅应用于旧IE版本.通过JS应用规则也应该起作用,就像你似乎正在做的那样.
Nat*_*hot 12
您可以尝试在标签上添加一个onclick来解决IE问题.
$('label').click(function() {
$('#' + $(this).attr('for')).click();
});
如果这不起作用,请尝试手动设置属性.
$('label').click(function() {
var checkbox = $('#' + $(this).attr('for'));
if (checkbox.is(':checked')) {
checkbox.removeAttr('checked');
} else {
checkbox.attr('checked', 'checked');
}
});
| 归档时间： |
|
| 查看次数： |
12721 次 |
| 最近记录： |