如何使用javascript根据另一个单元格上的单选按钮更改表格单元格的颜色?

如何使用javascript根据另一个单元格上的单选按钮更改表格单元格的颜色?,javascript,html,css,Javascript,Html,Css,我想更改单元格颜色,以防单击其他单元格中的某个单选按钮。我不知道为什么我的代码不起作用 班 功能失效元素{ text.value='-N.A.-'; obj.disabled=真; 功能启用元素1OBJ{ obj.value=; obj.disabled=false; } 功能使能元件2OBJ{ obj.value=; obj.disabled=false; } 使能元件1{ 颜色:绿色; } 使能元件2{ 颜色:红色; } 您当前的实现存在一些问题: 该元素既没有封装在元素中,也没有封装在元

我想更改单元格颜色,以防单击其他单元格中的某个单选按钮。我不知道为什么我的代码不起作用

班 功能失效元素{ text.value='-N.A.-'; obj.disabled=真; 功能启用元素1OBJ{ obj.value=; obj.disabled=false; } 功能使能元件2OBJ{ obj.value=; obj.disabled=false; } 使能元件1{ 颜色:绿色; } 使能元件2{ 颜色:红色; }
您当前的实现存在一些问题:

该元素既没有封装在元素中,也没有封装在元素中(元素可能是其子元素的唯一元素), 唯一具有for属性的元素是元素;for属性的值应等于引用元素的元素的id属性值,该元素只能引用一个元素,尽管、或元素可以与多个元素关联, 您的数据在本质上不是从表中提供的短的、不完整的样本表来的;如果您使用的是布局的原因,那么您应该考虑改变您的方法, 您正在使用多个函数来完成同一件事情,尽管使用的元素不同;请记住枯燥的原则:不要重复您自己的操作,并且 您使用的是突兀的JavaScript(带有HTML中的onclick事件处理程序),这使得代码的未来维护变得复杂。 考虑到所有这些,我是否可以提出一个替代方案:

//创建单个命名函数以处理所需的功能: 常量激活元素=函数{ //这里的“this”指的是事件侦听器绑定到的元素, //由EventTarget.addEventListener方法自动提供; //从更改后的元素中,我们可以找到最近的祖先元素: 设textarea=this.closest'tr'。querySelector'textarea', //从chnaged中,我们可以找到最近的祖先元素: 单元格=此。最近的'td', //从“cell”变量中检索textContent, //并使用String.prototype.toLowerCase将其转换为小写: 活动=cell.textContent.toLowerCase; //此处将自定义数据-*属性值设置为等于 //从“单元格”元素检索的值: textarea.dataset.isactive=活动; //这里我们将disabled属性设置为表达式的结果, //如果“活动”变量正好等于“无”,则禁用该变量 //属性设置为true,元素被禁用,否则 //disabled属性设置为false,元素已启用: textarea.disabled=active==“无”; }; //在这里,我们检索所有元素的非活动节点列表 //“type”属性值等于“radio”;然后使用 //NodeList.prototype.forEach迭代这些元素: document.querySelectorAll'input[type=radio]'。forEach //这里我们使用箭头函数,因为我们不需要使用“this”; //“输入”参数是对当前节点的引用 //我们正在迭代的节点列表: 输入=>{ //这里我们将事件侦听器绑定到当前元素/节点 //并绑定activateElement函数,注意故意缺少 //括号作为“更改”事件的事件处理程序: input.addEventListener'change',activateElement; }; /* 在这里,我们使用 数据isactive属性值等于“一”: */ textarea[数据isactive=1]{ 背景色:石灰; } /* 在这里,我们使用 数据isactive属性值等于“2”: */ textarea[数据isactive=2]{ 背景色:紫红色; } /* 这里我们选择所有元素;这个选择器 没有前面的选择器那么具体,因此 仅适用于没有“数据激活”的元素 属性,或具有不等于 “一个”或“两个”: */ 文本区{ 背景色:fff; } 适当地包装在一个元素中 元素内:-> 班 元素中的元素, 以便用户看到一些说明/指导 关于窗体控件的作用;以及删除 onclick事件处理程序:-> 一 二 没有一个
你能说得更具体些吗?什么单元格应该更改,以及根据什么单击单选按钮?你的代码片段似乎也不起作用-如果可以,请上传一个fiddle@Roysh我必须构建一个包含4个单元格的表格,其中3个单元格有单选按钮。如果单击其中一个单元格中的单选按钮,则第4个单元格会改变颜色,如果第三个单元格中的单选按钮单击d单选按钮。在CSS中,只有一个元素具有for属性或htmlFor属性enableElement1正在查找一个元素,而不是一个具有类enableElement1的元素,该类应改为在CSS中写为.enableElement1。disableElement函数不需要参数-从函数声明中-因此传递一个在波里
intless,因此obj引用没有引用任何内容。@admin123-您的代码与您描述的相差甚远。首先,创建表格单元格,然后使用jQuery,监听单选按钮上的单击事件,然后更改表格的背景颜色cell@Roysh我试图用javascript而不是jQuery来解决这个问题。