Select 的问题 jQuery 的选项循环

Question

我正在使用 jQuery 遍历许多 Select 选项 html 元素，我可以让它一次工作一个，但我很难访问如果数据存储在 jQuery 元素中。

例如我有这 2 Select html 个元素

var lList = $(".p1_lSelect");

var rList = $(".p1_rSelect");

我可以通过以下方式获得我想要的输出

$(".p1_lSelect option:selected").each(function() {
    selected = $(this).text(); //selected == "p1_lSelect_Data"
    console.log(selected);
});

$(".p1_rSelect option:selected").each(function() {
    selected = $(this).text(); //selected == "p1_rSelect_Data"
    console.log(selected);
});

//Console logs .p1_lSelect_Data and .p1_rSelect_Data as expected

我想要的是类似于以下内容的内容，这样我就可以更改要输入循环的列表

function foo(){
    var lList = $(".p1_lSelect");
    var rList = $(".p1_rSelect");
    bar(lList);
    bar(rList);
}

function bar(list){
    $("list option:selected").each(function() {
        selected = $(this).text();
        console.log(selected);
    });
    //Console log does not print
}

我该怎么做？

Answer 1

您可以传递列表的名称并将其附加到选择器，如下所示：

function foo(){
    bar("p1_lSelect");
    bar("p1_rSelect");
}

function bar(list){
    $(`.${list} option:selected`).each(function() {
        selected = $(this).text();
        console.log(selected);
    });
    //Console log does not print
}

Answer 2

使用find()方法：

function bar(list) {
    list.find("option:selected").each(function() {
        console.log($(this).text());
    });
});

Answer 3

请根据您的结构尝试以下代码：

function foo(){
    var lList = $(".p1_lSelect");
    var rList = $(".p1_rSelect");
    bar(lList);
    bar(rList);
}

function bar(list){
    $(list).find("option:selected").each(function() {
        selected = $(this).text();
        console.log(selected);
    });
    //Console log does not print
}

Select 的问题 jQuery 的选项循环

Issues with Select Option loop with jQuery

javascript

jquery

jquery-selectors

select-options