使用 jQuery 从 <select> 获取更改的值

Question

我正在尝试使用 jQuery 获取 <select> 输入的更改值。

更改前

<select class="input" multiple="multiple" name="inputUserRoles[]">
  <option value="Administrator">Administrator</option>
  <option value="Faculty" selected="selected">Faculty</option>
  <option value="Head of Department">Head of Department</option>
  <option value="Faculty Coordinator" selected="selected">Faculty Coordinator</option>
</select>

改动后

<select class="input" multiple="multiple" name="inputUserRoles[]">
  <option value="Administrator">Administrator</option>
  <option value="Faculty" selected="selected">Faculty</option>
  <option value="Head of Department">Head of Department</option>
  <option value="Faculty Coordinator">Faculty Coordinator</option>
</select>

如果您注意到，在更改事件之后，“教师协调员”选项不是 selected。

我希望获得“教师协调员”的价值。

我的 javascript 代码

$('select[name="inputUserRoles[]"]').change(function(e) {
  // this line gives me the value after the change event.
  var inputUserRoles = $(this).val();
});

可能的解决方案？

我在想事件 (e) 应该包含更改的数据，但我不知道如何获取它。我正在进行的项目已进入最后阶段，我只需要弄清楚这部分即可完成类似的剩余模块。

完成此操作的另一种方法是获取旧输入并进行比较。

Answer 1

这样做：

var valueBeforeChange = $('select[name="inputUserRoles[]"]').val();

$('select[name="inputUserRoles[]"]').change(function(e) {
  var inputUserRoles = $(this).val();

  //you can compare here with value before change
  ...

  valueBeforeChange = inputUserRoles;
});