对于选择菜单插件chosen.js ，有没有一个既定的方法来添加“选择列表中的所有项目”或“删除所有项目列表”功能，多选输入？ 在叉的一个主要分支或可能？ 或者已经有人这样做之前，有一些建议吗？
Answer 1:
它应该是非常简单的，只是做了“正常”的方式第一：
$('.my-select-all').click(function(){
$('#my_select option').prop('selected', true); // Selects all options
});
然后触发liszt:updated事件来更新所选择的部件，所以整个事情会是这个样子：
更新 ：对于那些谁不向下滚动，并检查其他的答案 ，该事件被称为chosen:updated为2013年8月发布，请查阅版本文档如果有疑问。
<select multiple>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<button class="select">Select all</button>
<button class="deselect">Deselect all</button>
$('select').chosen();
$('.select').click(function(){
$('option').prop('selected', true);
$('select').trigger('liszt:updated');
});
$('.deselect').click(function(){
$('option').prop('selected', false);
$('select').trigger('liszt:updated');
});
工作演示（js代码是在底部）： http://jsfiddle.net/C7LnL/1/
更紧密的版本： http://jsfiddle.net/C7LnL/2/
更严格的版本： http://jsfiddle.net/C7LnL/3/
Answer 2:
试试这个代码，它的工作100％
// Deselect All
$('#my_select_box option:selected').removeAttr('selected');
$('#my_select_box').trigger('chosen:updated');
// Select All
$('#my_select_box option').prop('selected', true);
$('#my_select_box').trigger('chosen:updated');
Answer 3:
我错过了类似的功能。 这增加了两个环节全部和无（文本通过定制选项uncheck_all_text和select_all_text）在弹出的列表的顶部。 您可能需要如果使用分组来进行编辑。
$("select").on("chosen:showing_dropdown", function(evnt, params) {
var chosen = params.chosen,
$dropdown = $(chosen.dropdown),
$field = $(chosen.form_field);
if( !chosen.__customButtonsInitilized ) {
chosen.__customButtonsInitilized = true;
var contained = function( el ) {
var container = document.createElement("div");
container.appendChild(el);
return container;
}
var width = $dropdown.width();
var opts = chosen.options || {},
showBtnsTresshold = opts.disable_select_all_none_buttons_tresshold || 0;
optionsCount = $field.children().length,
selectAllText = opts.select_all_text || 'All',
selectNoneText = opts.uncheck_all_text || 'None';
if( chosen.is_multiple && optionsCount >= showBtnsTresshold ) {
var selectAllEl = document.createElement("a"),
selectAllElContainer = contained(selectAllEl),
selectNoneEl = document.createElement("a"),
selectNoneElContainer = contained(selectNoneEl);
selectAllEl.appendChild( document.createTextNode( selectAllText ) );
selectNoneEl.appendChild( document.createTextNode( selectNoneText ) );
$dropdown.prepend("<div class='ui-chosen-spcialbuttons-foot' style='clear:both;border-bottom: 1px solid black;'></div>");
$dropdown.prepend(selectNoneElContainer);
$dropdown.prepend(selectAllElContainer);
var $selectAllEl = $(selectAllEl),
$selectAllElContainer = $(selectAllElContainer),
$selectNoneEl = $(selectNoneEl),
$selectNoneElContainer = $(selectNoneElContainer);
var reservedSpacePerComp = (width - 25) / 2;
$selectNoneElContainer.addClass("ui-chosen-selectNoneBtnContainer")
.css("float", "right").css("padding", "5px 8px 5px 0px")
.css("max-width", reservedSpacePerComp+"px")
.css("max-height", "15px").css("overflow", "hidden");
$selectAllElContainer.addClass("ui-chosen-selectAllBtnContainer")
.css("float", "left").css("padding", "5px 5px 5px 7px")
.css("max-width", reservedSpacePerComp+"px")
.css("max-height", "15px").css("overflow", "hidden");
$selectAllEl.on("click", function(e) {
e.preventDefault();
$field.children().prop('selected', true);
$field.trigger('chosen:updated');
return false;
});
$selectNoneEl.on("click", function(e) {
e.preventDefault();
$field.children().prop('selected', false);
$field.trigger('chosen:updated');
return false;
});
}
}
});
我也用CSS来限制选择，选项的情况下的高度也有说几十人：
.chosen-choices {
max-height: 150px;
}
Answer 4:
结算选择的只是直接的方式：
$('select').val('');
$('select').val('').trigger("chosen:updated");
Answer 5:
我意识到这个问题是很老，但我来到一个类似的问题，并希望分享我的结果，因为我喜欢它的简单：
我创建了两个按钮（所有和无）和浮动他们左边和右边包含我的选择下拉列表中的DIV中。 该按钮看起来是这样的：
<button style="float:left;" class="btn" id="iAll">All</button>
<button style="float:right;" class="btn" id="iNone">None</button>
然后，我添加了一些jQuery来处理按钮操作：
$('#iAll').on('click', function(e){
e.preventDefault();
$('#iSelect option').prop('selected', true).trigger('chosen:updated');
});
$('#iNone').on('click', function(e){
e.preventDefault();
$("#iSelect option:selected").removeAttr("selected").trigger('chosen:updated');
});
可能会需要一些清理至于布局，但它是相当实用的是，我想我会分享。
Answer 6:
$("#ctrlName option:selected").removeAttr("selected").trigger('liszt:updated');
清除所有
$("#ctrlName option").attr("selected","selected").trigger('liszt:updated');
全选
Answer 7:
你应该试试这个：
$('#drpdwn').empty();
$('#drpdwn').trigger('chosen:updated');
文章来源: 'select all' and 'remove all' with chosen.js
