BootStrap Select清除选中的状态恢复默认状态


Posted in Javascript onJune 20, 2017

PC端项目中经常会出现大量的数据列表页面,涉及到下拉框选择筛选条件;

当时用到bootstrap-select下拉框时该如何点击重置按钮就清除下拉框的选中状态呢?

如【图1】

BootStrap Select清除选中的状态恢复默认状态

当我们选择摸一个条件之后

如【图2】

BootStrap Select清除选中的状态恢复默认状态

此时点击重置按钮要将【图2】的状态回到【图1】,我们会使用很多方法,比如:          

$("#loc_province_search").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $("#loc_city_search").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $("#loc_town_search").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $(".txt_classification").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $(".txt_industry").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $(".txt_segmentation").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $(".customer_busi_status2").attr("lang",'0');//将下拉列表属性lang置为初始值 
      $("#searchkey").attr("lang",'0');//将下拉列表属性lang置为初始值</span>

或者这样:

document.getElementById("selectid").options.length = 0;

但是我们找了很多方法对于bootstrap-select下拉框都不会生效,其实就是因为bootstrap-select需要在清楚的基础上对当前的下拉框进行刷新,重新载入

代码如下:

document.getElementById("searchPayState").options.selectedIndex = 0; //回到初始状态
  $("#searchPayState").selectpicker('refresh');//对searchPayState这个下拉框进行重置刷新

以上代码即可解决问题

以上所述是小编给大家介绍的BootStrap Select清除选中的状态恢复默认状态,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery 插件之仿“卓越亚马逊”首页弹出菜单效果
Dec 25 Javascript
jquery keypress,keyup,onpropertychange键盘事件
Jun 25 Javascript
javascript 面向对象封装与继承
Nov 27 Javascript
js实现iGoogleDivDrag模块拖动层拖动特效的方法
Mar 04 Javascript
教你JS中的运算符乘方、开方及变量格式转换
Aug 09 Javascript
canvas压缩图片转换成base64格式输出文件流
Mar 09 Javascript
js使用i18n实现页面国际化的方法
May 09 Javascript
史上最全JavaScript数组去重的十种方法(推荐)
Aug 17 Javascript
Vue+Element实现动态生成新表单并添加验证功能
May 23 Javascript
vue中$refs, $emit, $on, $once, $off的使用详解
May 26 Javascript
jQuery实现高级检索功能
May 28 jQuery
vue实现滚动鼠标滚轮切换页面
Dec 13 Vue.js
Vue实现路由跳转和嵌套
Jun 20 #Javascript
Vue.2.0.5实现Class 与 Style 绑定的实例
Jun 20 #Javascript
JS中的三个循环小结
Jun 20 #Javascript
详解Vue 方法与事件处理器
Jun 20 #Javascript
Vue Ajax跨域请求实例详解
Jun 20 #Javascript
详解webpack 入门总结和实践(按需异步加载,css单独打包,生成多个入口文件)
Jun 20 #Javascript
详解Angular的8个主要构造块
Jun 20 #Javascript
You might like
整理php防注入和XSS攻击通用过滤
2015/09/13 PHP
php实现中文转数字
2016/02/18 PHP
C#中TrimStart,TrimEnd,Trim在javascript上的实现
2011/01/17 Javascript
JavaScript实现twitter puddles算法实例
2014/12/06 Javascript
jquery预加载图片的方法
2015/05/27 Javascript
jQuery中的ajax async同步和异步详解
2015/09/29 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
很实用的js选项卡切换效果
2016/08/12 Javascript
JavaScript prototype属性详解
2016/10/25 Javascript
AngularJS封装指令方法详解
2016/12/12 Javascript
JS前端加密算法示例
2016/12/22 Javascript
JS实现小球的弹性碰撞效果
2017/11/11 Javascript
AngularJS中重新加载当前路由页面的方法
2018/03/09 Javascript
最简单的JS实现json转csv的方法
2019/01/10 Javascript
微信小程序实现选项卡滑动切换
2020/10/22 Javascript
wxPython之解决闪烁的问题
2018/01/15 Python
Python实现识别手写数字 Python图片读入与处理
2020/03/23 Python
Python实现base64编码的图片保存到本地功能示例
2018/06/22 Python
TensorFlow实现Logistic回归
2018/09/07 Python
python matplotlib库直方图绘制详解
2019/08/10 Python
python实现高斯投影正反算方式
2020/01/17 Python
Python中的xlrd模块使用原理解析
2020/05/21 Python
如何导出python安装的所有模块名称和版本号到文件中
2020/06/05 Python
python os模块在系统管理中的应用
2020/06/22 Python
python实现梯度下降算法的实例详解
2020/08/17 Python
matplotlib设置颜色、标记、线条,让你的图像更加丰富(推荐)
2020/09/25 Python
旅游管理本科生求职信
2013/10/14 职场文书
视光学专业毕业生推荐信
2013/10/28 职场文书
大学生社会实践方案
2014/05/11 职场文书
趣味运动会策划方案
2014/06/02 职场文书
学习张林森心得体会
2014/09/10 职场文书
个人公司授权委托书范本
2014/10/12 职场文书
优秀大学生自荐信
2015/03/26 职场文书
学校党支部公开承诺书
2015/04/30 职场文书
导游词之江西赣州
2019/10/15 职场文书
Golang 实现超大文件读取的两种方法
2021/04/27 Golang