检测下拉列表是否为多选

时间:2015-10-28 15:36:06

标签: javascript jquery html-select

我有一个通用下拉列表填充脚本,它使用从各种jquery调用返回的选项填充select。它目前仅供单一选择。我需要添加一个填充多选的功能,它按原样运行,但我不想包含初始*请选择*选项。 我正在寻找一个jQuery或简单的Javascript解决方案。

if (dropdown != null) {
    var regList = document.getElementById(dropdown);
    regList.options.length = 0;
    var opt = document.createElement("option");

    // ** if the dropdown is *not* a multiple="multiple", 
    // add the first option as an empty value

    opt.text = " -- Select --";
    opt.value = "";
    regList.options.add(opt);

    // **

    // loop thorugh child nodes and fill dropdown.
    $.each(arg.d, function () {
        opt = document.createElement("option");
        opt.text = this;
        opt.value = this;
        regList.options.add(opt);
    });
    $('.SpinImage').remove();
}

3 个答案:

答案 0 :(得分:8)

您可以检查对象的.multiple属性

var isMulti = document.getElementById('selectId').multiple; // true/false

jQuery你可以做.prop(' multiple');

$('#selectId').prop('multiple');

http://jsfiddle.net/31eLyzb3/4/

/*
    Using jQuery, finds and populates the selects on the page.
*/
(function populateAll() {
    /* Here's our options info */
    var opts = {
        'volvo': 'Volvo',
        'saab' : 'Saab',
        'opel' : 'Opel',
        'audi' : 'Audi'
    };
    /*
        This function, given a jQuery select item, and options list, populates it.
        If it is a single-select, it adds a ---Select---/empty value as the first option.
    */
    function populate(listBox, options) {
        var option = null;
        if (listBox.prop('multiple') === false) {
            option = document.createElement('option');
            option.text = '---Select---';
            option.value = '';
            listBox.append(option);
        }
        $.each(options, function (value, label) {
            option = document.createElement('option');
            option.text = label;
            option.value = value;
            listBox.append(option);
        });
    }
    /* Find all select tags on page and populate with 'opts' data */
    $('select').each(function() {
        populate($(this), opts);
    });
})();

答案 1 :(得分:1)

您可以检查是否存在multiple属性,如果它存在,则其值不为真,如下所示:

if(!regList.hasAttribute("multiple") && !regList.getAttribute("multiple")) {
    opt.text = " -- Select --";
    opt.value = "";
    regList.options.add(opt);
}

答案 2 :(得分:-2)

您使用插件或库来渲染下拉列表吗? chosen库支持修改或删除他们称之为default text的内容。在您的情况下,"请选择"字符串。