javascript - 当数据库返回值时运行脚本

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>

这是正在运行的脚本:

<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/