使用 javascript 启用和禁用复选框答案

【问题标题】：Enabled and disabled checkbox using javascript使用 javascript 启用和禁用复选框
【发布时间】：2016-04-16 15:53:52
【问题描述】：

这是我的复选框和文本框：

<td> <input type ="checkbox" id="haha" onclick="enable('<?php echo $agenda->id; ?>')" value=<?php echo $agenda->id; ?>>

<td> <input type="text" name="dnama" id="nama_<?php echo $agenda->id; ?>" value="<?php echo $agenda->nama; ?>" disabled /> </td>
<td> <input type="text" name="dketer" id="ket_<?php echo $agenda->id; ?>" value="<?php echo $agenda->keterangan; ?>" disabled> </td>

这是我的 javascript：

function enable(id) {
var disabled = !document.getElementById('haha').checked;
document.getElementById("nama_"+id).disabled = disabled;
document.getElementById("ket_"+id).disabled = disabled; }

我的问题是为什么这仅适用于第一行，我选中了第一个复选框，文本框将被启用，然后我取消选中第一个复选框并选中第二个复选框，其他文本框仍然禁用..我该如何解决这个问题？

【问题讨论】：

如果你能删除 php 并提供一个小提琴，那该多好
“为什么这仅适用于第一行”，id 是唯一的，如果您不止一个具有相同 id #haha 的复选框，它将适用于第一行。
是的，谢谢。你说得对，我的复选框具有相同的 id #haha 但不同的值。我该如何解决？我试过 getElementByid('haha').value，但它不起作用。
请将您的问题编辑成一个 sn-p（单击 [] 按钮）并删除所有 PHP，因为它与问题无关，实际上看起来您需要修复 ID 处理跨度>
如果它具有相同的 id 而不是 ID，则传递此对象并获取值，然后获取 id 并将其传递给依赖元素的 id。

标签： javascript checkbox

【解决方案1】：

你可以只使用一个函数：

function toggle(someId) {
    document.getElementById(someId).disabled = !document.getElementById(someId).disabled;
}

【讨论】：

【解决方案2】：

您想要以下内容：

function testEna() { 
  var dis = this.checked;
  document.getElementById("nama"+this.id).disabled=dis;
  document.getElementById("ket"+this.id).disabled=dis;
}
window.onload=function() {
  var ena = document.querySelectorAll(".enabler");
  for (var i=0;i<ena.length;i++) {
    ena[i].onclick=testEna;
    ena[i].onclick(); // run now too
  }
}

使用

<input type="checkbox" class="enabler" id="<?php echo $agenda->id; ?>" />

<input type="text" name="dnama" id="nama_<?php echo $agenda->id; ?>" value="<?php echo $agenda->nama; ?>"/>
<input type="text" name="dketer" id="ket_<?php echo $agenda->id; ?>" value="<?php echo $agenda->keterangan; ?>"/>

【讨论】：

【解决方案3】：

我不知道你的 ID，但禁用和启用复选框代码是这样的：

function enable() {
    document.getElementById("some_id").disabled= false;

}

function disable() {
    document.getElementById("some_id").disabled= true;
}

【讨论】：

他正确使用了复选框的选中布尔值

【解决方案4】：

试试这个..

function EnableDisable(id) {
document.getElementById("nama_"+id).disabled =false;
document.getElementById("ket_"+id).disabled = false;
var disabled = !document.getElementById('haha').checked;
document.getElementById("nama_"+id).disabled = disabled;
document.getElementById("ket_"+id).disabled = disabled; }

【讨论】：

【解决方案5】：

我不知道你的确切问题，但最好使用 jQuery 来解决这个问题。我已经尝试过这个。见下面的jsfiddel链接

jsfiddle.net/ravipateldhg/5c7rdt0a

【讨论】：

【解决方案6】：

正如你所说，你使用相同的 id 两次。不改变 id 你可以使用它。但是你应该更新参数，即你应该传递这个对象而不是传递 id

function enable(pobj) {
var id = pobj.value;
var disabled = !pobj.checked;
document.getElementById("nama_"+id).disabled = disabled;
document.getElementById("ket_"+id).disabled = disabled;
}

不建议使用相同的id。

参考可以查看https://jsfiddle.net/uw5f001q/3/

【讨论】：