从复选框中删除禁用

Question

我有2个复选框设置为切换按钮。 默认情况下，第二个复选框为disabled。 当第一个复选框为ja时，我希望删除第二个复选框disabled。

我用2个代码尝试过此操作，但未成功。 在我的控制台中，没有看到错误。

<div class="checkbox">
  <label>
    <input type="checkbox" id="email_user" name="email_user" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" onclick="remove_disabled()">
    Verstuur melding ook per e-mail naar collega.
  </label>
</div>
<div class="checkbox">
  <label>
    <input type="checkbox" id="email_relatie" name="email_relatie" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" disabled>
    Verstuur een kopie van deze melding naar de relatie.
  </label>
</div>

选项1

<script type="text/javascript">
function remove_disabled() {
    document.getElementById('email_relatie').disabled = false;
}
</script>

选项2

<script type="text/javascript">
function remove_disabled() {
    document.getElementById('email_relatie').removeAttr('disabled')
}
</script>

Answer 1

对我来说，document.getElementById("email_relatie").disabled = false;可以正常工作。只需使用change处理程序并检查该复选框是否已选中：

function remove_disabled() {
  if(document.getElementById("email_user").checked)
    document.getElementById("email_relatie").disabled = false;
  else 
    document.getElementById("email_relatie").disabled = true;
}

<div class="checkbox">
  <label>
    <input type="checkbox" id="email_user" name="email_user" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" onchange="remove_disabled()">
    Verstuur melding ook per e-mail naar collega.
  </label>
</div>
<div class="checkbox">
  <label>
    <input type="checkbox" id="email_relatie" name="email_relatie" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" disabled>
    Verstuur een kopie van deze melding naar de relatie.
  </label>
</div>

Answer 2

我猜想您希望在未选中第一个复选框时再次禁用该复选框，否则您的给定代码将起作用。您可以通过在选中第一个复选框时将disable属性设置为false，而不是将其设置为true来实现此目的。

function toggle_disabled() {
    document.getElementById('email_relatie').disabled = !document.getElementById('email_user').checked;
}

 <label>
    <input type="checkbox" id="email_user" name="email_user" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" onclick="toggle_disabled()">
    Verstuur melding ook per e-mail naar collega.
  </label>
</div>
<div class="checkbox">
  <label>
    <input type="checkbox" id="email_relatie" name="email_relatie" data-toggle="toggle" data-size="small" data-on="Ja" data-off="Nee" disabled>
    Verstuur een kopie van deze melding naar de relatie.
  </label>
</div>
Option 1

Answer 3

您尝试了吗？

<input type="checkbox" ... disabled="disabled">

document.getElementById('email_relatie').removeAttr('disabled');

Answer 4

您可以像这样使用do：

$("input[name='email_relatie']").prop("disabled", false);

Answer 5

使用.prop()

$("[type='checkbox']").prop("disabled", false);