Question

我需要禁用“日期”输入，直到选中“截止日期”选项。我尝试过以下但是没有用。有什么建议吗？

CODE

<Select>
  <option onselect="document.getElementById('deadline').disabled = false;">Deadline date</option>
  <option>Monthly</option>
</Select>

<input id="deadline" type="date" disabled>

Answer 1

您需要将事件处理程序附加到select上的change事件，然后使用this.value检查其值。

最后，相应地将输入的disabled属性设置为true或false。

document.getElementsByTagName('select')[0].onchange = function() {
  document.getElementById('deadline').disabled = this.value != 'Deadline date';
}

<select>
  <option>Deadline date</option>
  <option>Monthly</option>
</select>

<input id="deadline" type="date" disabled>

Answer 2

在dropdown更改活动中，您可以根据匹配条件添加或删除attribute这样的内容。

$("select").change(function() {
  if ($(this).val() == 'Deadline date')
    $('#inpTest').removeAttr('disabled');
  else
    $('#inpTest').attr("disabled", true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<Select>
 <option>---select---</option>
  <option>Deadline date</option>
  <option>Monthly</option>
</Select>

<input type="date" disabled="disabled" id='inpTest'>

Answer 3

这应该是它：

function validate() {

  var dropdown = document.getElementById('dropdown');
  var selectedOption = dropdown.options[dropdown.selectedIndex].value;
  
  var input = document.getElementById('date');
  
  if (selectedOption == "enabled") {
    input.removeAttribute('disabled');
  } else {
    input.setAttribute('disabled', 'disabled');
  }
}

<select id="dropdown" onchange="validate()">
  <option value="disabled">Pick something</option>
  <option value="enabled">Deadline date</option>
  <option value="disabled">Monthly</option>
</select>

<input type="date" id="date" disabled="disabled">

Answer 4

您的问题是＆lt; option＆gt; 上的事件未触发。请查看以下代码。

<select id="selectedOption" onchange="myFunction()">
  <option>select</option>
  <option>Deadline date</option>
  <option>Monthly</option>
</select>

<input id="deadline" type="date" disabled>

<script>
function myFunction() {
    if (document.getElementById("selectedOption").value == "Deadline date") {
        document.getElementById("deadline").disabled = false;
    } else {
        document.getElementById("deadline").disabled = true;
    }
}
</script>

希望对你有所帮助。

保持输入被禁用，直到在html

4 个答案: