问题描述
我想使用@glyuck 的例子中的多选下拉菜单
http://jsfiddle.net/surajkm33/tsomyckj/
<select id="divratings" class="selectpicker" multiple data-size="5" data-selected-text-format="count>2">
<option value="All" selected="selected">All ratings</option>
<option value="EC">EC (Early Childhood)</option>
<option value="E">E (Everyone)</option>
<option value="E10+">E10+ (Everyone 10+)</option>
<option value="T">T (Teen)</option>
<option value="M">M (Mature)</option>
<option value="AO">AO (Adults Only)</option>
</select>
<script>
$('#divratings').on('change',function(){
var thisObj = $(this);
var isAllSelected = thisObj.find('option[value="All"]').prop('selected');
var lastAllSelected = $(this).data('all');
var selectedOptions = (thisObj.val())?thisObj.val():[];
var allOptionsLength = thisObj.find('option[value!="All"]').length;
console.log(selectedOptions);
var selectedOptionsLength = selectedOptions.length;
if(isAllSelected == lastAllSelected){
if($.inArray("All",selectedOptions) >= 0){
selectedOptionsLength -= 1;
}
if(allOptionsLength <= selectedOptionsLength){
thisObj.find('option[value="All"]').prop('selected',true).parent().selectpicker('refresh');
isAllSelected = true;
}else{
thisObj.find('option[value="All"]').prop('selected',false).parent().selectpicker('refresh');
isAllSelected = false;
}
}else{
thisObj.find('option').prop('selected',isAllSelected).parent().selectpicker('refresh');
}
$(this).data('all',isAllSelected);
}).trigger('change');
</script>
但我希望在选择所有选项时文本为“所有评级”,而不是“选择了 7 个项目”。
关于如何实现这一目标的任何想法?我是 JS 新手,所以我不知道!