禁用使用 font-awesome 创建的复选框答案

【问题标题】：Disabling checkboxes created using font-awesome禁用使用 font-awesome 创建的复选框
【发布时间】：2019-12-16 04:55:21
【问题描述】：

我是前端技术的新手，想实现以下目标。我试图找到一个解决方案，但直到现在都没有帮助我。我的问题是这样的—— 假设我有 2 个主复选框标记 1）我不喜欢数字 2）我不喜欢字母（两者都使用字体真棒样式的复选框）

<div class="x-form-cb-li select-option2">
<input type="checkbox" name="brands" id="no-brand" style="display: none;">
<i class="fa fa-square-o"></i>
<i class="fa fa-check-square-o" style="display: none; color:#228B22;"></i>
<label id="label-numbers" for="none" class="x-form-cb-label">I do not like numbers</label>
<label id="label-alphabets" for="none" class="x-form-cb-label">I do not like alphabets</label>

我们有五个标记为1,2,3,4和5的复选框，当检查具有标签ID =“标签号”的复选框时，请禁用这五个复选框。同样，我们有五个标记为A，B，C，D和E以及使用标签ID =“Label-Alphabets”的复选框时，请选中此五个复选框。所有这些都应该使用字体很棒的图标。我可以用普通的复选框来实现这一点，但我被字体真棒的那些卡住了。

编辑：有人可以帮我写代码吗 https://jsfiddle.net/ankit1191/wb4snfm6/45/ 其中，当复选框-'我不喜欢数字'被选中时，复选框-'1'被禁用，而当未选中复选框-'1'时，它进入正常状态。

【问题讨论】：

您描述它的方式看起来应该使用单选按钮，请参阅w3schools.com/html/tryit.asp?filename=tryhtml_radio，您可以像普通复选框一样将它们制作成字体很棒的图标。
@Jeremy 我在 Pushpendra 的回答中添加了评论。希望它能让问题更清楚一点。

标签： javascript html css checkbox font-awesome

【解决方案1】：

在 div 中使用引导类 disabled 和类 x-form-cb-li select-option2 disabled。我认为您正在尝试使用引导程序禁用。检查引导程序中的禁用类。

<div class="x-form-cb-li select-option2 disabled">
<input type="checkbox" name="brands" id="no-brand" style="display: none;">
<i class="fa fa-square-o"></i>
<i class="fa fa-check-square-o" style="display: none; color:#228B22;"></i>
<label id="label-numbers" for="none" class="x-form-cb-label">I do not like numbers</label>
<label id="label-alphabets" for="none" class="x-form-cb-label">I do not like alphabets</label>

【讨论】：

disabled 在这里不起作用。你能帮我纠正一下吗--> jsfiddle.net/ankit1191/wb4snfm6/35。在其中，我正在努力处理 JS 代码，我希望在选中复选框时禁用 1 和 2 - “我不喜欢数字”，但 a 和 b 保持启用并取消选中它，再次启用它们。如果前 2 个主复选框未选中，则其余 1,2,a,b 无条件工作。