首页 > bootstrap的multiple selects内容预加载

bootstrap的multiple selects内容预加载

效果图:

目标:
在预加载时,把后台获取的字符串显示在选择框中。
用.html()的方式添加,得到的结果可以显示,但是无法删除。
代码详情:这是未选择时的代码

<div class="chosen-container chosen-container-multi" style="width: 100%;" title="" id="demo_cs_multiselect_chosen">
    <ul class="chosen-choices">
        <li class="search-choice">
            <span>United States</span>
            <a class="search-choice-close" data-option-array-index="0"></a>
        </li>
        <li class="search-field">
            <input type="text" value="Choose a Country..." class="" autocomplete="off" style="width: 25px;" tabindex="4">
        </li>
    </ul>
    <div class="chosen-drop">
        <ul class="chosen-results">
            <li class="result-selected" data-option-array-index="0">United States</li>
            <li class="active-result" data-option-array-index="1">United Kingdom</li>
            <li class="active-result" data-option-array-index="2">Afghanistan</li>
            <li class="active-result" data-option-array-index="3">Aland Islands</li>
            <li class="active-result" data-option-array-index="4">Albania</li>
            <li class="active-result" data-option-array-index="5">...</li>
        </ul>
     </div>
</div>

js部分的代码要贴吗?
谁了解过……是不是在预加载的时候修改chosen的container的class使之和选择之后的结果一致?这样有效吗?
我觉得bootstrap不会这么坑吧……这个问题他们考虑过吗?相应要修改的class太多了,dropdown的,选项的active
等等……


其实这个是chosen插件的问题,在给option元素动态添加active后,别忘记$("#id").trigger("chosen:updated");


无法删除有可能是你动态添加的元素的事件没绑定上造成的。试试用事件委托的方式去绑定删除事件.

【热门文章】
【热门文章】