bootstrap-multiselect重置-reset

最新推荐文章于 2024-05-14 09:36:19 发布

aklin47

最新推荐文章于 2024-05-14 09:36:19 发布

阅读量928

点赞数

文章标签： js

本文链接：https://blog.csdn.net/aklin47/article/details/110390949

版权

bootstrap-multiselect使用过程中发现重置按钮没有提供可编辑的点击方法，自行添加了一个

                            /**
							 * Triggered on reset.
							 */
							onReset : function() {

							},

使用类比onChange()，调用：

<script type="text/javascript">
	$(function(){
		

        $('#uu').multiselect({
        	 maxHeight: 200,
        	 nonSelectedText: '选择',
        	 buttonClass: 'btn btn-white btn-default',
        	
            /* 全选没有意义，不提供
            includeSelectAllOption: true,
        	selectAllText: '全选', */
            
        	includeResetOption: true,
            resetText: "重置",

            /*不清楚是不是版本原因，option是居左的，需要居中得话重新指定*/
        	optionClass: function(element) {
                return 'text-center';
             },
        	 onChange: function(option, checked, select) {
                 //alert('Changed option ' + $(option).val() + '.');
                 var selectedV = "(";
                 $("#uu option:selected").each(function () {
                	 if(selectedV == "("){
                		 selectedV += $(this).val();
                	 }else{
                		 selectedV += ","+$(this).val();
                	 }
                 });
                 selectedV += ")";
                 if($("#uu option:selected").length == 0){
                	 selectedV = "";
                 }
                 $("#PERIODS").val(selectedV);
             },
            /*重置*/
             onReset: function(){
            	 $("#uus").val("");
             }
        });
        /*回显*/
        var uus=$("#uus").val();
        if(uus){
        	uus= periods.substring(1,periods.length-1).split(",");
	        $("#uu").multiselect('select',uus);
        }

	})
</script>

在使用的时候发现重置按钮不显示，查看bootstrap-multiselect文档时（https://www.bootstrap-multiselect.cn/）发现需要版本对应，刚开始jQuery使用的是v2.1.1，bootstrap-multiselect使用的是v0.9.8（大概吧，记不清楚了），，后来把bootstrap-multiselect换成v2.0版本就可以显示重置按钮了，但是option不自动居中了