jquery – Bootstrap Multiselect – 使用插件进行单选,始终选择第一项

2023年10月20日 340次阅读

我正在使用
Bootstrap Multiselect插件从多选下拉列表和单选下拉列表中选择值

我注意到了几个问题并尝试了几个选项,但没有一个可行.如果有人已经解决了,需要建议.

>当使用插件进行单选时,我的第一项始终被选中
>无法更改单个下拉列表的nonSelectedText文本.

JsFiddle

HTML

<select class="multiselect">
<option value="cheese">    Cheese     </option>
<option value="tomatoes">  Tomatoes   </option>
<option value="mozarella"> Mozzarella </option>
<option value="mushrooms"> Mushrooms  </option>
<option value="pepperoni"> Pepperoni  </option>
<option value="onions">    Onions     </option>

使用Javascript

$(function() {
$('.multiselect').multiselect({
        nonSelectedText: 'Check an option!'
    });
});

CSS

.multiselect-container input[type=radio] {
   display: none;
}

最佳答案 解决方法：

HTML：

<form>

  <input type="text" placeholder="Name...">

  <select class="multiselect" size="2">
    <option value="cheese">Cheese</option>
    <option value="tomatoes">Tomatoes</option>
    <option value="mozarella">Mozzarella</option>
    <option value="mushrooms">Mushrooms</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="onions">Onions</option>
  </select>

  <button type="reset">
    Reset
  </button>

</form>

JS：

$('.multiselect').multiselect({
    nonSelectedText: 'Choose an option!'
});
$('[type="reset"]').click(function () {
    $('.multiselect-selected-text').attr('title', 'Choose an option!').html('Choose an option!');
    $('.multiselect-container li').removeClass('active');
});

JSFIDDLE

点赞