今天被一个重置bootstrap的select的需求所困扰许久,最后通过网上一位大神指点迷津,成功解决。这里把他分享给大家
》》============================================================================》
若简单地采用Reset按钮重置可能就达不到所想要的结果,因为bootstrap为了美化select,在原生态select之下又添加了一层,详见下图源码截图:
这就需要采用jQuery来控制select显示及真实的select值,上代码:
1 $("button[type='reset']").click(function(){ 2 $(':input').attr("value",''); 3 $("select.selectpicker").each(function(){ 4 $(this).selectpicker('val',$(this).find('option:first').val()); //重置bootstrap-select显示 5 $(this).find("option").attr("selected", false); //重置原生select的值 6 $(this).find("option:first").attr("selected", true); 7 }); 8 });
最后附上小弟的代码:
reset : function(){ $("#busubviewName").val(""), $("#busubviewRootName").val(""), $("#menutype-selectpicker").each(function(){ $(this).selectpicker('val',$(this).find('option:first').val()); $(this).find("option").attr("selected", false); }), $("#isable-selectpicker").each(function(){ $(this).selectpicker('val',$(this).find('option:first').val()); $(this).find("option").attr("selected", false); }) this.requestRemoteData(v_pagePack); },