javascript - JQuery 函数在 ejs 中不触发

Question

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
    alert( "ready!" );
    $('#dropDown').click(function() {
    console.log("run");
    var selected = $('#dropDown').find(":selected").text();
    console.log(selected);
    });
});

</script>

<div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">
                    <center>Benchmark Usage</center>
                </h1>
            </div>
            <!-- /.col-lg-12 -->
  </div>
<div class="row" data-ng-controller="">
<div class="col-md-12">

<select id="dropDown">
<option value="day">every day</option>
<option value="minute">every minute</option>
</select>

<iframe src="http://vgzeburt55:5601/goto/517982d9d05378bac8368b4bf91338fe?embed=true" height="710" width="100%"></iframe>
</div>
</div>

我试图通过 jquery 获取选定的文本。但是，即使准备就绪警报也不会出现。我错过了什么吗？另外，我是否试图以正确的方式获取所选文本？

Answer 1

绑定(bind)on('change' 事件。

工作示例:

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
    alert( "ready!" );
    
    $('#dropDown').on('change', function() {
      alert( this.value );
      console.log("run");
    var selected = this.value;
    console.log(selected);
    })

    
});

</script>

<div class="row">
            <div class="col-lg-12">
                <h1 class="page-header">
                    <center>Benchmark Usage</center>
                </h1>
            </div>
            <!-- /.col-lg-12 -->
  </div>
<div class="row" data-ng-controller="">
<div class="col-md-12">

<select id="dropDown">
<option value="day">every day</option>
<option value="minute">every minute</option>
</select>

<iframe src="http://vgzeburt55:5601/goto/517982d9d05378bac8368b4bf91338fe?embed=true" height="710" width="100%"></iframe>
</div>
</div>