javascript - 从选择框获取id

Question

我有多个选择框，如下所示:

<form action="foo" method="post" id="form">
    <select id="one">
        <option value="foo1"></option>
        <option value="foo2"></option>
        <option value="foo3"></option>
      </select>
      <select id="two">
          <option value="bar1"></option>
          <option value="bar2"></option>
          <option value="bar3"></option>
      </select>
      <select id="three">
          <option value="baz1"></option>
          <option value="baz2"></option>
          <option value="baz3"></option>
      </select>
</form>

现在，如果这三个框中的任何一个发生变化，我想知道是哪一个。我尝试了如下，但我只得到了第一个盒子的ID。我是否必须为每个选择编写它，或者有没有办法获取更改后的选择框的 id？

$(document).ready(function() {
    $('#form').change(function() {    
        var strChosen = $('select').attr('id');    
        alert(strChosen);    
    });  
});

Answer 1

使用this关键字并将选择器更改为$('#form select')

Demo

$(document).ready(function() {
  $('#form select').change(function() {
    var strChosen = $(this).attr('id');
    alert(strChosen);
  });
});

注意:您还可以使用 .on() 方法进行 change 事件，例如

$('#form select').on('change',function() {});

更多语法信息，可以引用@sbaaaang的answer