Select Bootstrap 模态 Window 中的更改事件框

Select box on change event in Bootstrap Modal Window

我用的是bootstrap 3.[=20=里面有个select盒子 ]模态window。在 select 框的更改事件中,我必须在控制台上显示它的值。第一次该值是正确的,但此后更改事件中不显示任何值。这是我的代码。

<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
    <h4 class="modal-title">Class</h4>
</div>
<div class="modal-body">
    <form>
      <div class="form-group">
        <select name='class' id='class'>
        <option value='Class 1'>1</option>
        <option value='Class 2'>2</option>
        <option value='Class 3'>3</option>
        <option value='Class 4'>4</option>
        </select>
      </div>
    </form>
</div>
<script>
var class = $('#class');
class.on('change', function (e) {
    console.log(this.value);
});
</script>

谁能帮帮我..我哪里错了。

注意:代码第一次运行没有任何问题。但是当我关闭模式并在没有页面刷新的情况下再次打开模式时,控制台上不会显示任何值。如果页面被刷新然后它的工作。

这是为您准备的fiddle。 请避免使用保留关键字作为变量、class 或 id 名称。[https://jsfiddle.net/4s5mkbj8/2/]

$('#class').on('change', function (e) {
    console.log(this.value);
});