jQuery 根据数组值隐藏下拉选项

Question

我有一个 types 数组，如下所示，我正在尝试仅启用 typesarray

中存在的 Dropdown 选项

var types = ["LEDES 1998B", "LEDES 1998B-INTL"]

在 UI 上，我只需要在 types 中的下拉列表中看到 'LEDES 1998B'、'LEDES 1998B-INTL'，其他选项必须隐藏

<select id="FormatType" name="instance_FormatType.id" data-name="Format Type">
<option value="">-- Select --</option>      
    <option value="1">
        LEDES 1998B
    </option>       
    <option value="2">
        LEDES 1998B-INTL
    </option>
    <option value="3">
        LEDES 98BI
    </option>       
    <option value="4">
        Summary
    </option>

有人可以帮我做这个吗？

Answer 1

假设您的数组格式有效，您可以使用 filter 检查选项。试试这个：

var types = ["LEDES 1998B", "LEDES 1998B-INTL"];
$('#FormatType option:not(:first)').filter(function() {
    return $.inArray($.trim($(this).text()), types) == -1;
}).remove(); // or possibly hide() depending on your need/browser support

Example fiddle

Answer 2

您无法隐藏它们，可以删除或禁用它们

可以通过以下方式禁用它，示例禁用值为 3 的选项

$("#request5900-instance_qiFormatType>option[value='3']").attr('disabled', true);

Answer 3

原版 JS 版本：

var select = document.getElementById('request5900-instance_qiFormatType');
var types = ["LEDES 1998B", "LEDES 1998B-INTL"];

for( var i=0; i<select.options.length; i++ ){
    var label = select.options[i].innerHTML.trim();
    if( types.indexOf( label ) < 0 ){
        select.removeChild( select.options[i] );
        // need to decrement because indexes change after node removal
        i--;
    }
}

http://jsfiddle.net/xsyab5kt/

Answer 4

$( "option" ).each(function( index ) {
      if(jQuery.inArray(($( this ).text()), types)!==-1) {
        $("option[value=" + ($(this).attr('val')) + "]").hide();
        } 
});

希望对您有所帮助！

jQuery 根据数组值隐藏下拉选项

jQuery Hide Options of a Dropdown as per Array values

javascript

jquery

drop-down-menu