如何为单选按钮和复选框设置禁用/只读功能

Posted 2023-03-05

【中文标题】如何为单选按钮和复选框设置禁用/只读功能

【英文标题】：How to make disabled/readonly functionality for radio buttons and checkboxes

【发布时间】：2012-05-21 22:35:07

【问题描述】：

我知道我们不能使 只读 单选按钮和复选框。我试图禁用单选按钮和复选框，但在 IE 中它不可见。

是否有任何替代方法可以使用 jQuery、CSS、javascript 像 disabled / readonly 一样做同样的事情？

【问题讨论】：

是的，但它与您已经尝试过的完全相同，将 disabled 属性设置为 disabled 等。

你在做什么代码..

检查这个问题的公认答案：***.com/questions/1953017/… 它可以很好地使单选按钮有效地只读。

【参考方案1】：

您可以使用以下代码来避免点击您不希望用户更改的元素

$(':radio,:checkbox').click(function()
    return false;
);

您可以使用适当的选择器来限制点击次数。

【讨论】：

感谢它有效。是否可以将背景颜色应用于单选按钮和复选框，以便在不使用图像的情况下看起来像已禁用？我尝试使用 $(':radio,:checkbox').css("background-color", 'red");

我认为你做不到。为此，您必须使用某种图像。但是如果你想给它一个禁用的效果，最好禁用它；那么它在所有浏览器上看起来都是一致的。我以为你想禁用没有禁用效果的复选框/单选按钮。

是的，你是对的。我想禁用类似功能而没有禁用效果。如果我指定禁用复选框和单选按钮，则它在 IE 中不清晰可见。

这在 IE 中有一个不幸的副作用（测试于 2011 年 9 月 10 日）：如果您单击未选中的按钮，选中的按钮会在视觉上“取消选中”。

【参考方案2】：

你可以这样写：-

在您的脚本中：

 jQuery('#radio').attr('disabled','disabled');

或者你可以根据你的需要添加类..

如果它与 IE 不兼容，也提供兼容性..

<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />

然后检查..

你也可以试试这个：

jQuery("#youridname input:radio").attr('disabled',true);

【讨论】：

我知道这已经过时了，但对于任何想使用此解决方案的人，请记住，提交表单时不会发布禁用的元素。

【参考方案3】：

selectedRow
    .find('input[type="radio"]:not(:checked)')
    .each(function()
        $(this).attr('disabled', true);
);

所选行只是我想要在其下方找到我感兴趣的单选按钮的 html 元素。 只有在选择了单选按钮后才会调用整个脚本。 执行时，它会定位未选中的单选按钮并禁用它们。

因此，给了我想要的结果，即禁用未选中的单选按钮，同时保持选中的选项。

这个结果似乎是一个更好的选择，那么 1. 在单选按钮上放置图像，以避免用户选择另一个选项。 2..click(function() return false; )，它只是在选择未选中的选项时隐藏选择 3. 禁用所有单选按钮，选择丢失。

希望对你有帮助， 干杯。

【参考方案4】：

如果单选按钮已被选中，并且如果您单击选中的单选按钮，它会将值从 true 更改为 false。对于这种情况，以下代码有效

$(document).ready(function () 
    $('input[type = "radio"]').change(function () 
        this.checked = false;
    );
);