zoukankan      html  css  js  c++  java
  • 设置bootstrap按钮组选中状态

    使用bootstrap(V3.3.7)按钮组(btn-group)时,很多时候我们需要按钮组在显示的时候,预先设置一个按钮处于选中状态。

    <div class="text-right" style="margin-bottom:0.5em;">
    	排序:<span class="btn-group btn-group-sm" role="group" id="orderBtnGroup">
    		<button class="btn btn-default" onclick="showAccessList('createDate')">时间</button>
    		<button class="btn btn-default" onclick="showAccessList('readCount')">阅读</button>
    		<button class="btn btn-default" onclick="showAccessList('goodCount')">点赞</button>
    	</span>
    </div>
    

    可以通过两种方法:为按钮添加active类(写在html代码里)、用js方法。两种方法的本质是一样的。后一种方法可以把按钮点击事件调用、按钮状态修改统一起来。

    $("#orderBtnGroup .btn:first").click().addClass("active");
    

    但是有个问题,就是当点击按钮组其他按钮时,不能清除选中状态。目前没有找到好的办法。只好在按钮的点击事件中,去除一下所有按钮的active状态。

    $("#orderBtnGroup").children().removeClass("active");
    

      

  • 相关阅读:
    数据结构-链式结构-队列
    c数据结构-线性结构-队列
    栈的四则运算的运用
    C++/C—函数指针
    向显存写数据x8086
    结构体内存偏移量
    MFC-ComboBox控件的使用
    MFC的Edit text编辑框控件
    C/C++反汇编-各种表达式(加减乘)
    MFC- 学习控件-静态文本
  • 原文地址:https://www.cnblogs.com/mr-hu2009/p/10869801.html
Copyright © 2011-2022 走看看