javascript - jquery从多个中获取当前选定的值

Question

我有选择下拉菜单，在其中使用数组登录名称，例如

<select name="services[]" id="service_id" multiple>
  <option value="4">four</option>
  <option value="1">one</option>
  <option value="3">three</option>
</select>

现在我需要从更改事件的下拉列表中获取当前(最后)选择的值。

到目前为止我尝试过的是

var clicked = $('#service_id option:selected').last().val();
alert(clicked);
//also tried as
//$(this).closest('select').find('option').filter(':selected:last').val();
//and this is tried too
// $(this).val();
// this.value;

当多重选择时，所有这些都给了我错误的值。

我需要什么

如果选择four，然后选择one，它应该提醒1(记住多选时)。

如果选择三，然后选择四，那么它应该提醒4

简而言之，即使在多选中也始终需要点击选项的值

** 无法从名称 services[] 中删除数组符号

Answer 1

没有原生方法，但您可以保存单击选项的顺序，然后获取最后一个。

即，针对选择上的data属性:-

$('#service_id option').click(function() {
  var values = $(this).parent().data('values') || [];
  var index = values.indexOf(this.value);
  index >= 0 ? values.splice(index, 1) : values.push(this.value);
  $(this).parent().data('values', values);
});

$('#service_id').click(function() {
  var values = $(this).data('values');
  console.log(values);
  
  var last = values[values.length - 1];
  console.log('last:' + last);  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select name="services[]" id="service_id" multiple>
  <option value="4">four</option>
  <option value="1">one</option>
  <option value="3">three</option>
</select>