检测下拉列表是否为多select
Detect if a dropdown list is a multi-select
我有一个通用的下拉列表填充脚本,它使用从各种 jquery 调用返回的选项填充 select
。它目前适用于单个 selection。我需要向它添加填充多 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();
}
您是否使用插件或库来呈现下拉菜单? chosen library has support for modifying or removing what they call the default text。在你的例子中 "Please Choose" string.
您可以检查 multiple
属性是否存在,如果它存在,它的值是否为真,方法如下:
if(!regList.hasAttribute("multiple") && !regList.getAttribute("multiple")) {
opt.text = " -- Select --";
opt.value = "";
regList.options.add(opt);
}
你可以查看对象的.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);
});
})();
我有一个通用的下拉列表填充脚本,它使用从各种 jquery 调用返回的选项填充 select
。它目前适用于单个 selection。我需要向它添加填充多 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();
}
您是否使用插件或库来呈现下拉菜单? chosen library has support for modifying or removing what they call the default text。在你的例子中 "Please Choose" string.
您可以检查 multiple
属性是否存在,如果它存在,它的值是否为真,方法如下:
if(!regList.hasAttribute("multiple") && !regList.getAttribute("multiple")) {
opt.text = " -- Select --";
opt.value = "";
regList.options.add(opt);
}
你可以查看对象的.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);
});
})();