叠加层内的样式复选框 - 选中always = false

时间:2012-01-14 04:08:22

标签: html checkbox

我正在使用jQuery插件来设置HTML复选框/单选按钮的样式。问题是,当这些复选框出现在灯箱叠加层内时,其checked属性永远不能设置为“true”。它们在视觉上看起来当然是检查过但它们并不是真的,这在.NET环境中不起作用。

我已经尝试过其他插件,我已经尝试深入研究这个特定插件的代码(prettycheckboxes)。似乎存在一些问题,输入元素绝对位于页面之外(左:-9999px),因为当我从CSS中删除它而不是使用visibility:hidden时,复选框再次起作用。

但是,除了我的灯箱内出现的复选框外,我还在灯箱内部还有一个手风琴类型元素,其中还包含复选框。无论我对CSS做什么,这些都不起作用。

当删除prettycheckboxes插件时,当然复选框工作。如果我将prettycheckboxes样式的元素放在灯箱之外,它们就可以工作。

其他人遇到过这个问题吗?

1 个答案:

答案 0 :(得分:0)

好的我觉得我已经解决了这个问题,虽然我不确定为什么会这样。显然,使用此插件(prettyCheckboxes),输入最初呈现方式,可见性或位置存在一些问题。输入的CSS(正如原始的prettycheckboxes css编写)是:

input.hiddenCheckbox{position:absolute;left:-10000px;}

.hiddenCheckbox是由prettyCheckboxes插件应用于复选框的类。这适用于不在灯箱内的复选框。但是当在灯箱内时,他们的托运物业不会检查。我改成了这个:

input.hiddenCheckbox{visibility: hidden;}

这解决了FF和Chrome中的问题,但未解决IE7 / 8中的问题

对于IE7 / 8,我必须这样做:

input.hiddenCheckbox{height: 0;visibility: visible;}

同样,我不确定为什么会这样,但确实如此。我对此并不完全满意。任何人都知道为什么这会起作用?