javascript - 下拉框值启用字段

Question

我有以下代码来运行我的下拉框和字段，当值不等于下拉列表中的值时，我想禁用它。

我的代码如下。

document.getElementById('type').addEventListener('change', function() {
  if (this.value == Hijacking) {
    document.getElementById('hijacking').disabled = false;
  } else {
    document.getElementById('hijacking').disabled = true;
  }
});

<div class="width-qrtr">
  <label>Type of event</label>
  <select name="Type" id="select">
          <option value="">Select Type</option> 
          <option value="Fraud">Fraud</option>
          <option value="Theft">Theft</option>
          <option value="Accident">Accident</option>
          <option value="Hijacking">Hijacking</option>
     </select>
</div>
<div class="width-qrtr">
  <label>Police Station</label>
  <input id="textbox" disabled="true" type="text" name="Test" />
</div>

它使该字段保持禁用状态。如果我将值更改为数字，它可以工作，但我需要将 SQL 值插入到我的数据库中

Answer 1

document.getElementById 仅当您将相应的 id 放入由 id="..." 定义的情况下才有效。另外，要比较字符串值，您必须将它们放在引号中 => this.value == 'Hijacking'。

更正后的代码如下所示:

document.getElementById('select').addEventListener('change', function() {
  if (this.value == 'Hijacking') {
    document.getElementById('textbox').disabled = false;
  } else {
    document.getElementById('textbox').disabled = true;
  }
});

<div class="width-qrtr">
  <label>Type of event</label>
  <select name="Type" id="select">
          <option value="">Select Type</option> 
          <option value="Fraud">Fraud</option>
          <option value="Theft">Theft</option>
          <option value="Accident">Accident</option>
          <option value="Hijacking">Hijacking</option>
     </select>
</div>
<div class="width-qrtr">
  <label>Police Station</label>
  <input id="textbox" disabled="true" type="text" name="Test" />
</div>