數據庫返回值時運行腳本

Question

當值更改時，我有一個運行腳本的下拉菜單。 但是現在我想從數據庫中返回選定的值，並在選定的值為： 2時運行腳本。

這是我的下拉菜單：

<div class="col-md-9 col-sm-9 col-xs-12">
  <select class="form-control select2" id="status" name="status" style="width: 100%;">
    <option <?php echo ($row["status"] == "1") ? 'selected="selected"' : '';?> value="1">One</option>
    <option <?php echo ($row["status"] == "2") ? 'selected="selected"' : '';?> value="2">Two</option>
  </select>
</div>

輸出結果應部署在此處：

<p id="output1"></p>

這是在onchange上運行的腳本：

<script type="text/javascript">
  var dataEl = document.querySelector('#status'),
  outputEl = document.querySelector('#output1');

  dataEl.onchange = function() {
    if (dataEl.value === "1") {
      outputEl.innerHTML = ' ';
    } else if (dataEl.value === "2") {
      outputEl.innerHTML = '<div>(script)</div>';
    }
  };
</script>

我想保留腳本進行onchange。 但是，當數據庫返回的值= 2時，我也想運行此腳本。 我嘗試了其他腳本，例如添加dataEl.onLoad腳本，但這也沒有顯示值2的腳本。

有人知道我該怎么做嗎？

Answer 1

要獲得選擇選項的選定值，您需要使用selectedIndex 。

var e = document.getElementById("status");
var sel = e.options[e.selectedIndex].value;

主要示例： https : //jsfiddle.net/z1wyz62s/

@John的完整示例： https : //jsfiddle.net/z1wyz62s/3/

Answer 2

你為什么不打電話呢？

dataEl.onchange = function() {
  if (dataEl.value === "1") {
    outputEl.innerHTML = ' ';
  } else if (dataEl.value === "2") {
    var result = your_script();
    outputEl.innerHTML = '<div>'+result+'</div>';
  }
};