『前端日志』基于Bootstrap框架实现单选按钮组

目标：生成连在一起的三个按钮，点击任意一个按钮，该按钮会显示按下的样式，而另外两个按钮是未按下的样式。同时，为三个按钮分别添加触发函数。

问题：其实是参考的别人的代码，只是不太好找，所以记录一下。

代码：

<!--以input和label实现的单选按钮组-->                    
<div style="float : right" class="btn-group" data-toggle="buttons">
    <span style="float : left; margin-top : 7px">View by : &nbsp;</span>                
    <label id="userProfile" for="" class="btn btn-default active" onclick="userShow()">               
        <input type="radio" name="switch" autocomplete="off">User profile           
    </label>                         
    <label id="quotaStatus" for="" class="btn btn-default" onclick="quotaShow()">                 
        <input type="radio" name="switch" autocomplete="off">Quota status             
    </label>
    <label id="idcardInfo" for="" class="btn btn-default" onclick="idShow()">                 
        <input type="radio" name="switch" autocomplete="off">ID-Card Info             
    </label>
</div>

效果：添加的事件是，点击时在表格中显示不同的数据



我记得，CSDN上面好像有大神的文章说，div属性用data-toggle=“buttons-radio”，下面用button标签写按钮组就可以了，反正我试过不行。
参考的文章一时找不到，找到了再补上链接。如有问题，欢迎指正！

来源：CSDN

作者：mad_house

链接：https://blog.csdn.net/mad_house/article/details/103686236