Question

我想使用单选按钮作为设计元素，没有任何功能。用户不应该检查或取消选中它们。

<div id="divRadios">
<input type="radio">
<input type="radio">  
...
</div>

我认为解决方案可能是在#divRadios上放置一个单独的空div并给它更高的z-index，但是可能还有更原生的方式？

Answer 1

如果您不希望用户检查，请使用<input type = 'radio' />

创建span或div并向其添加radio类：

 .radio{
     -moz-appearance:radio;
     -webkit-appearance:radio; 
    }

Answer 2

只需禁用它们：

<input type="radio" disabled>

Answer 3

另一种禁用收音机而不会丢失其实际样式的方法（没有'禁用'标签）

    <input type="radio" id="rd1" name="radio">
    <input type="radio" id="rd2" name="radio" style="display: none;">

    <script>
    $( '#rd1' ).click( function(e) { 
        $('#rd2').click();
    });
    </script>

Answer 4

您可能希望在无线电输入元素上使用'disabled'属性：

<div id="divRadios">
<input type="radio" disabled>
<input type="radio" disabled>  
...
</div>

Answer 5

作为@ user2404546答案的扩展，最佳解决方案似乎只是使用常规复选框，但更改其外观：

.radio{
     -moz-appearance:radio;
     -webkit-appearance:radio; 
}

<input class="radio" type="checkbox">

如何关闭单选按钮功能？

5 个答案: