我正在使用 David Stutz 的 bootstrap Multi-select 插件,我在显示“全部选中”时遇到问题。使用 allSelectedText 方法有效,但在使用“allSelectedText”回调时会被覆盖。
使用上一个问题的答案,我试图获取 child 的数量并检查他们是否都被选中(见评论)
注意 - 如果我删除“numberofOptions”,这会起作用
使用 buttonText 回调/allSelectedText 方法,这里是文档的链接 - http://davidstutz.github.io/bootstrap-multiselect/
感谢您的意见。
JS
$(document).ready(function() {
$('#multiselect').multiselect({
//Following line is being overridden by the numberOfOptions
allSelectedText: 'All Selected',
buttonText: function(options, select) {
//grab the number of childeren to later return 'all selected'
var numberOfOptions = $(this).children('option').length;
if (options.length === 0) {
return 'Select';
}
else if (options.length > 1) {
return '1+ Selected';
}
//This line is calculating number of options,
//displaying 'AllSelected in the label'
else if (options.length === numberOfOptions) {
return 'AllSelected';
}
else {
var labels = [];
options.each(function() {
if ($(this).attr('label') !== undefined) {
labels.push($(this).attr('label'));
}
else {
labels.push($(this).html());
}
});
return labels.join(', ') + '';
}
},
buttonWidth: '100%',
includeSelectAllOption: true,
});
});
HTML
<select id="multiselect" multiple="multiple">
<option value="x">XYZ</option>
<option value="x">XYZ</option>
<option value="x">XYZ</option>
<option value="x">XYZ</option>
<option value="x">XYZ</option>
</select>
最佳答案
我使用文档中的以下内容解决了这个问题。
显示数量:1
$(document).ready(function() {
$('#multiselect').multiselect({
allSelectedText: 'All',
numberDisplayed: 1,
buttonWidth: '100%',
includeSelectAllOption: true,
});
});
关于javascript - Bootstrap Multiselect 插件显示 'all selected',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29700651/