点击Confirm按钮获取对应上方select选中值的jQuery问题求助

你遇到的问题主要有两个核心原因：

1. 选错了操作对象：代码里用$('.confirm-btn')会选中页面上所有的确认按钮，而非当前被点击的那一个，所以直接用.action-options时只会拿到第一个select的选中值。
2. .closest()方法用错场景：.closest()的作用是查找当前元素的祖先元素，但你的<select>和按钮是同级的兄弟关系，并非父子/祖孙层级，所以这个方法找不到目标select，自然返回undefined。

修正后的代码 #

只需要把操作对象换成当前点击的按钮（$(this)），然后用.prev()方法获取它的前一个兄弟元素（也就是对应的select），再提取选中值即可：

$('body').on('click', '.confirm-btn', function(e) { 
  e.preventDefault(); 
  // 用$(this)指代当前被点击的按钮，prev()获取它前面的同级select
  var x = $(this).prev('.action-options').find(':selected').val(); 
  console.log(x); 
}); 

扩展：如果select和按钮不是直接相邻的情况 #

如果后续页面结构调整，select和按钮之间可能插入其他元素，你可以用.prevAll()配合:first来定位最近的前一个select：

var x = $(this).prevAll('.action-options:first').find(':selected').val();

或者先找到它们共同的父容器，再在容器内精准查找select（假设它们都在同一个类为action-group的容器里）：

var x = $(this).closest('.action-group').find('.action-options').find(':selected').val();

这样就能准确获取每个按钮对应的select选中值了！

内容的提问来源于stack exchange，提问作者Andy