当前位置:  首页  >  前端开发  >  JavaScript

JS组件Bootstrap按钮组与下拉按钮详解_javascript技巧

这篇文章主要为大家介绍了JS组件Bootstrap按钮组与下拉按钮的相关资料,感兴趣的小伙伴们可以参考一下
本文先为大家分享按钮组的使用方法,具体内容如下

一、按钮组(Button Groups)

1、单个按钮组
用.btn-group封装多个带.btn的

2、多个按钮组
将多个

放进

?#23567;?br />

...

...

3、垂直按钮组
向.btn-group添加.btn-group-vertical。

...

二、下拉按钮(Button Dropdowns)

例子

Action

1、控制大小
同样使用.btn-large、.btn-small、.btn-mini控制大小。

2、分割的下拉按钮

3、向上出现的菜单

三、JavaScript

例子
加载状态。添加data-loading-text="Loading..."。

代码如下:

开关状态。添加data-toggle="button"。

代码如下:

复选框。在btn-group后添加data-toggle="buttons-checkbox"。

单选。在btn-group后添加data-toggle="buttons-radio"。

用法
JavaScript代码触发开关状态。
$().button("toggle")
也可添加data-toggle属性自动触发。

使用JavaScript代码触发加载状态,同时按钮显示data-loading-text属性指定的值。

$().button("loading")


注意:Firefox在页面载入时会保持按钮无效状态。变通方案是在按钮上应用autocomplete="off"。

使用JavaScript代码重置按钮状态。
$().button("reset")

重置按钮状态,并将按钮文?#30452;?#25104;指定的文字。下例的complete仅为例子,可以替换。

 
《script》 
 $('.btn').button('complete') 
《script》 

以上就是本文的全部内容,希望对大家的学习?#20852;?#24110;助。

吐了个 "CAO" !
扫码关注 PHP1 官方微信号
PHP1.CN | 中国最专业的PHP中文社区 | PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | PHP问答
Copyright ? 1998 - 2020 PHP1.CN. All Rights Reserved PHP1.CN 第一PHP社区 版权所有
     
28玩法
福建体彩网 欢乐捕鱼有挂吗 053期福彩开奖号 棒球棒英语怎么读 esball世博线上娱乐 福建体育彩票22选5玩法 重庆时时每天开盘时间 全球捕鱼2破解版 网络赚百万 欢乐捕鱼人赢话费 双色球2019084期红球 2019网络赚钱灰色产业 推牌9压钱能赢钱的技巧 多乐彩走势今天的图 彩民村排列3金胆