javascript 如果在使用 IE 7 或 8 时隐藏，单击标签不检查复选框
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11543021/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Clicking on label not checking checkbox if hidden when using IE 7 or 8
提问by Tom
I am trying to create a custom designed checkbox using the label associated to a checkbox element and hiding (display:none) the checkbox.
我正在尝试使用与复选框元素关联的标签并隐藏（显示：无）复选框来创建自定义设计的复选框。
This works fine in all browsers except IE, which requires the checkbox to be visible for the label to be clickable.
这在除 IE 之外的所有浏览器中都可以正常工作，IE 要求复选框可见才能使标签可点击。
Here's my code...
这是我的代码...
HTML
HTML
<input type="checkbox" id="myCheck" />?
CSS
CSS
label.checkbox {
border:1px solid #666;
width:25px;
height:23px;
display:block;
}?
jquery
查询
$("input[type=checkbox]").each(function() {
$(this).hide().before('<label for="' + $(this).attr("id") + '" class="checkbox"></label>');
});
$("input[type=checkbox]").live('change', function() {
if ($(this).prop('checked') == true) {
$('label[for=' + $(this).attr("id") + ']').html("X")
} else {
$('label[for=' + $(this).attr("id") + ']').html("")
}
});?
Or jsfiddle
或者jsfiddle
回答by Okan Kocyigit
I don't know whether there is a more efective way to do this, but you can do this by setting checkbox element position out of the page,
我不知道是否有更有效的方法来做到这一点，但是您可以通过将复选框元素位置设置在页面之外来实现这一点，
.hiddenEl {
position:absolute;
top: -3000px;
}
$("input[type=checkbox]").each(function() {
$(this).addClass("hiddenEl").before('<label for="' + $(this).attr("id") + '" class="checkbox"></label>');
});
UPDATE
更新
And also you can set checbox opacity to zero, that will hide it without "dispayl:none",
而且您还可以将复选框不透明度设置为零，这将隐藏它而没有“dispayl：none”，
$(this).css("opacity", 0)
or
或者
$(this).fadeTo(0, 0)
回答by Carsen
try this:
试试这个：
#myCheck{
position:absolute;
left:-9999px;
}
And leave the check box "visible"
并保留复选框“可见”
