Question

使用jquery mobile。

尝试将禁用的复选框显示为可见。高度/宽度可以被覆盖。

<div class=" ui-checkbox ui-state-disabled">
 <input type="checkbox" name="foo" checked="checked" disabled="disabled">
</div>

为什么这个位置很重要，而且无法覆盖。因此，在不同情况下，它与相邻元素不能很好地对齐。

.ui-checkbox input:disabled, .ui-radio input:disabled {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px,1px,1px,1px);
}

感谢您的建议。

Answer 1

要使用jQM样式，请将复选框放在LABEL中（无论您是否有文本）。然后，当窗口小部件被增强时，如果它被禁用，则不透明度用于调暗复选框。

<label>
    <input type="checkbox" name="foo" checked="checked" disabled="disabled" /> Check me   
</label>    
<label>
    <input type="checkbox" name="bar" checked="checked" disabled="disabled" />    
</label>

jQM实际上隐藏了INPUT元素，并将标签设置为复选框。

另一方面，如果您希望jQM保持未设置样式的复选框，请添加data-role =＆＃34; none＆＃34;：

<input type="checkbox" name="bar" checked="checked" disabled="disabled" data-role="none" />

jquery移动复选框样式问题

1 个答案: