Jquery下拉选择框

我有一个非常简单的问题，如果我有相同下拉框的集合（行），如何使用Jquery选择单个值

如中所示，我想返回（kite）或（22），具体取决于我单击的下拉列表

>Jquery

$(document).on('change', 'select[name=options]', function() {
   var selectVal= $(this).siblings('select').val();
    alert(selectVal);
});

HTML

蒂皮埃利
风筝
旗帜
球
路
1.
2.
3.
4.
11
22
33
44

如果要显示

值

属性，则

$(document).on('change', 'select[name=options]', function() {
   var selectVal = $(this).val();
    alert(selectVal);
});​

如果您想在下拉列表中显示文本，那么Sushants的答案是合适的

---

小提琴-

如果您希望获得文本内容，请使用

$(this).find('option:selected').text();

如果要获取当前值

$(this).val();

代码

$(document).on('change', 'select[name=options]', function() {
    var selectVal= $(this).find('option:selected').text();
    alert(selectVal);
});​

只需更改：

var selectVal= $(this).siblings('select').val();

到

您可以使用从所有

标记中获取一系列值，如下所示：

$(document).on('change', 'select[name=options]', function() {
    var selectVal= $(this).parent().siblings().andSelf().find('select').map(function() {
        return $(this).val();
    }).get();
    alert(selectVal);
    // alerts something like "2,1,1"
});​

---

更新了JSFIDLE。

其他选择项不是已更改选择项的同级，因为它们都在

td

标记中， 因此，请使用：

$(document).on('change', 'select[name=options]', function() {
    var selectVal=$(this).parent().siblings('td').find('select').map(function() {
       return $(this).val();
    });
 //delete junk
    delete(selectVal.context);
    delete(selectVal.prevObject);
    console.log(selectVal);
});​

但这将只返回另外两个（不仅仅是更改的值），这可能不是您想要的，因此下一个代码：

$(document).on('change', 'select[name=options]', function() {
//this will return array
    var selectVal=$(this).parents('tr').find('td > select').map(function() {
       //use here alert or whatever you want
       return $(this).val();
    });
    //delete junk
    delete(selectVal.context);
    delete(selectVal.prevObject);
    console.log(selectVal);
});​

我没有使用

和self（）

，因为它会改变数组中值的顺序

$(document).on('change', 'select[name=options]', function() {
    var selectVal=$(this).parent().siblings('td').find('select').map(function() {
       return $(this).val();
    });
 //delete junk
    delete(selectVal.context);
    delete(selectVal.prevObject);
    console.log(selectVal);
});​

$(document).on('change', 'select[name=options]', function() {
//this will return array
    var selectVal=$(this).parents('tr').find('td > select').map(function() {
       //use here alert or whatever you want
       return $(this).val();
    });
    //delete junk
    delete(selectVal.context);
    delete(selectVal.prevObject);
    console.log(selectVal);
});​