如何限制jQuery mobile的多选弹出窗口中的选择选项? [英] How can I limit selecting options in multi select popup of jQuery mobile?

问题描述

    <select data-native-menu="true" id="food_type"  multiple="multiple" data-placeholder="Favourite food types" class="chzn-select-tag photo-status-update-tags"  multiple="" tabindex="-1">
                            <option data-placeholder='true' value="" disabled="disabled">Favourite food types</option>
                           <?php foreach($this->aFoods as $aFood):  ?>
                            <option value="<?php echo $aFood['food_name']; ?>" ><?php echo $aFood['food_name']; ?></option>
                           <?php endforeach; ?>
    </select>



jQuery('#food_type').on('change', function() {
if (this.selectedOptions.length <= 5) {
    jQuery(this).find(':selected').addClass('selected');
    jQuery(this).find(':not(:selected)').removeClass('selected');
} else {

    jQuery(this)
    .find(':selected:not(.selected)')
    .prop('selected', false);

}
});

这是我的代码.我将选择的选项限制为5.它可以工作.但是在多选弹出窗口中，可以选择5以上的选项.我的要求是，如果有人尝试选择5个以上的选项，请禁用选择在多选弹出窗口中.我正在使用jquery mobile 1.2.1

Here is my code.I had limited the selected option to 5.Its working.But in multi select popup it is possible to select more than 5.My requirement is,if anyone tries to select more than 5 options, disable selection in multi select popup.I am using jquery mobile 1.2.1

推荐答案

该问题现已解决..我已通过更改<select>属性'data-native-menu ="false"更改了多选弹出窗口的样式'.如下所示:

The issue is fixed now..I have changed the style of multi select popup by changing the <select> attribute 'data-native-menu="false"'. Just like below:

<select data-native-menu="false" id="food_type"  multiple="multiple" data-placeholder="Favourite food types" class="chzn-select-tag photo-status-update-tags"  multiple="" tabindex="-1">

这篇关于如何限制jQuery mobile的多选弹出窗口中的选择选项?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！