如何隐藏html中的复选框？ [英] How can I hide a checkbox in html?

问题描述

我想隐藏一个复选框。

但也想要的是，当我点击与相应的复选框，应该选中/取消选中复选框。

I want to hide a checkbox.
But also want that, when I click on label associated with corresponding checkbox, the checkbox should get checked/unchecked.

复选框必须能够专注。

我正在做以下事情：

<div class="menuitem">
    <label class="checkbox"><input type="checkbox" value="valueofcheckbox" style="display:none" checked="checked">Option Text</label>
</div>

上面的问题是，我不能使焦点 c

The problem with above is, I am not able to make focus the checkbox when style="display:none".

<$ c $> c> checkbox focusable我在做：

To make checkbox focusable I am doing :

$('input', '.menuitem').focus();

如果可以，如何使隐藏的复选框 focusable？

IF POSSIBLE, how do I make the hidden checkbox focusable?

推荐答案

尝试将复选框的不透明度设置为0.如果您希望复选框流出，请尝试<$

Try setting the checkbox's opacity to 0. If you want the checkbox to be out of flow try position:absolute and offset the checkbox by a large number.

HTML

<label class="checkbox"><input type="checkbox" value="valueofcheckbox" checked="checked" style="opacity:0; position:absolute; left:9999px;">Option Text</label>

这篇关于如何隐藏html中的复选框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！