jquery从表列中获取所有值

I'm looking for a way to populate a select box with unique values from a table column using jQuery. So far my attempts have been futile but I am relatively new to front end development so I'm hoping someone can show me the light.

我正在寻找一种方法，使用jQuery从表列填充具有唯一值的选择框。到目前为止，我的尝试都是徒劳的，但我对前端开发相对较新，所以我希望有人可以告诉我这个问题。

Cheers.

干杯。

2 个解决方案

#1

This should get you started. Note that I use the cell contents for both the value and the text of the option. You may need to change this but it is unclear from the question.

这应该让你开始。请注意，我将单元格内容用于选项的值和文本。您可能需要更改此内容，但问题尚不清楚。

var items=[], options=[];

//Iterate all td's in second column
$('#tableId tbody tr td:nth-child(2)').each( function(){
   //add item to array
   items.push( $(this).text() );       
});

//restrict array to unique items
var items = $.unique( items );

//iterate unique array and build array of select options
$.each( items, function(i, item){
    options.push('<option value="' + item + '">' + item + '</option>');
})

//finally empty the select and append the items from the array
$('#selectId').empty().append( options.join() );

#2

you can use jquery's each function:

你可以使用jquery的每个函数：

function FillSelect(){
    var vals = new Array();
    var i=0;
    var options='';
    $("#tbl tr:gt(0) td:nth-child(2)").each(function(){
       var t=$(this).html();
       if($.inArray(t, vals) < 0)
       {
           vals[i]=t;
           i++;
       }
    });

    for(var j=0;j<i;j++)
    {
        options += '<option value="' + j + '">' + vals[j] + '</option>';
    }

    $("#sel2").html(options);
}

suppose 'tbl' is ID of your table, 'sel2'is id of select you want to populate. If you don't want to exclude first row then you can remove tr:gt(0) and put simple tr in selector expression.

假设'tbl'是你的表的ID，'sel2'是你要填充的select的id。如果您不想排除第一行，则可以删除tr：gt（0）并将简单tr放在选择器表达式中。

#1