Javascript 如何在html表格中灰显

当我尝试创建html表时，我想知道如何将未选中的单元格变灰

当我单击单元格2时，我想要的结果如下所示

我尝试了下面的代码。如果有更复杂的greyout方法，请让我知道

谢谢

var$=jQuery； $'td'。单击，函数E{ e、 防止违约； $'table'。切换类'greyout'； } 运输署{ 背景色：浅绿色； 过渡时间：0.5s； 边框：纯黑1px； 填充物：5px； } 桌子{ 边界塌陷：塌陷； } 格雷厄特先生{ 不透明度：0.2； /*真正的浏览器*/ } 1. 2. 3. 4. 5. 6. 7. 8. 9

---

您需要将该类应用于除单击的单元格外的所有单元格，因此请使用not方法。还要注意，要启用后续单击，您需要在将该类添加到下一个集合之前从任何td元素中删除该类

另外请注意，preventDefault在td click处理程序上是多余的，因为没有要防止的默认操作。另外，如果要别名$，请使用document.ready处理程序中的参数

说了这么多，试试这个：

jQuery$=>{ 让$td=$'td'。单击，函数{ $td.removeClass'greyout'。而不是this.addClass'greyout'； } }; 运输署{ 背景色：浅绿色； 过渡时间：0.5s； 边框：纯黑1px； 填充物：5px； } 桌子{ 边界塌陷：塌陷； } 格雷厄特先生{ 不透明度：0.2； } 1. 2. 3. 4. 5. 6. 7. 8. 9

---

您需要将该类应用于除单击的单元格外的所有单元格，因此请使用not方法。还要注意，要启用后续单击，您需要在将该类添加到下一个集合之前从任何td元素中删除该类

另外请注意，preventDefault在td click处理程序上是多余的，因为没有要防止的默认操作。另外，如果要别名$，请使用document.ready处理程序中的参数

说了这么多，试试这个：

jQuery$=>{ 让$td=$'td'。单击，函数{ $td.removeClass'greyout'。而不是this.addClass'greyout'； } }; 运输署{ 背景色：浅绿色； 过渡时间：0.5s； 边框：纯黑1px； 填充物：5px； } 桌子{ 边界塌陷：塌陷； } 格雷厄特先生{ 不透明度：0.2； } 1. 2. 3. 4. 5. 6. 7. 8. 9

---

我倾向于以下逻辑：

$mainTable=$'table'； $mainTable.on'click'，'td'，函数{ 如果此.classList.包含“选定”{ $this.removeClass'selected' }否则{ $mainTable.find'.selected'.removeClass'selected'； $this.addClass'selected' } $mainTable.toggleClass'withSelectedOption'，$mainTable.find'.selected'.length！==0； }; 表td{ 背景：水； 填充：10px； } 表1.1选择选项td{ 背景：灰色； } 表1.1选择了选项td{ 背景：水； } 123 456 789

---

我倾向于以下逻辑：

$mainTable=$'table'； $mainTable.on'click'，'td'，函数{ 如果此.classList.包含“选定”{ $this.removeClass'selected' }否则{ $mainTable.find'.selected'.removeClass'selected'； $this.addClass'selected' } $mainTable.toggleClass'withSelectedOption'，$mainTable.find'.selected'.length！==0； }; 表td{ 背景：水； 填充：10px； } 表1.1选择选项td{ 背景：灰色； } 表1.1选择了选项td{ 背景：水； } 123 456 789

---

我喜欢tdI的缓存，就像td的缓存一样