自学bootstrap遇到的疑惑篇:

按钮状态——禁用

在Bootstrap框架中,要禁用按钮有两种实现方式:

  方法1:在标签中添加disabled属性

  方法2:在元素标签中添加类名“disabled”

两者存在区别:

“.disabled”样式不会禁止按钮的默认行为,比如说提交和重置行为等。

如果想要让这样的禁用按钮也能禁止按钮的默认行为,则需要通过JavaScript这样的语言来处理。

对于<a>标签也存在类似问题,如果通过类名“.disable”来禁用按钮,其链接行为是无法禁止。

而在元素标签中添加“disabled”属性的方法是可以禁止元素的默认行为的。

但是经过我自己的测试,发现不论是加上disabled还是加上.disabled类,鼠标都是无法点击的,这是因为在bootstrap中设置了禁用鼠标事件:

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
pointer-events: none;
cursor: not-allowed;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
box-shadow: none;
opacity: .65;
}

 但是可以通过键盘快捷键来完成按钮默认的行为事件;

学习bootstrap遇到的问题--001 关于bootstrap中类.disabled不禁用默认行为的更多相关文章

  1. 【读书笔记《Bootstrap 实战》】1.初识Bootstrap

    作为Web前端开发框架,Bootstrap为大多数标准的UI设计常见提供了用户友好.扩浏览器的解决方案. 1.下载Bootstrap 打开官方网址 http://getbootstrap.com/ 进 ...

  2. Bootstrap Magic – 轻松创建自己的 Bootstrap 主题

    Bootstrap Magic 是一款基于 Bootstrap 和 AngularJS 的主题创建工具.您可以轻松地创建您自己的 Twitter Bootstrap 主题,可以立即看到你的内容变化.您 ...

  3. ASP.NET MVC使用Bootstrap系统(2)——使用Bootstrap CSS和HTML元素

    阅读目录 Bootstrap 栅格(Grid)系统 Bootstrap HTML元素 Bootstrap 验证样式 ASP.NET MVC创建包含Bootstrap样式编辑模板 小结 Bootstra ...

  4. ASP.NET MVC使用Bootstrap系列(3)——使用Bootstrap 组件

    阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...

  5. Bootstrap页面布局1 - 下载BS(bootstrap简称)

    1.bootstrap 官方网站:http://wrongwaycn.github.io/bootstrap/docs/index.html 2.如图: 3.下载后得到如下目录结构 bootstrap ...

  6. bootstrap上传表单的时候上传的数据默认是0 一定要小心

    bootstrap上传表单的时候上传的数据默认是0 一定要小心

  7. org.elasticsearch.bootstrap : JNA not found. native methods will be disabled

    在pom.xml中添加以下依赖,解决elasticsearch的WARN: <dependency> <groupId>com.sun.jna</groupId> ...

  8. bootstrap.min.js:6 Uncaught Error: Bootstrap's JavaScript requires jQuery at bootstrap.min.js:6

    自己写了个Django系统,用到了Django-bootstrap3结果在浏览器控制台发现报错:bootstrap.min.js:6 Uncaught Error: Bootstrap's JavaS ...

  9. 错误Uncaught Error: Bootstrap's JavaScript requires jQuery at bootstrap.min.js:6 错误详解

    引入Bootstrap的顺序进行修改 <% //获取以/开始,不以/结尾的部分 pageContext.setAttribute("APP_PATH", request.ge ...

随机推荐

  1. React Native填坑之旅--class(番外篇)

    无论React还是RN都已经迈入了ES6的时代,甚至凭借Babel的支持都进入了ES7.ES6内容很多,本文主要讲解类相关的内容. 构造函数 定义侦探类作为例子. ES5的"类"是 ...

  2. PureCode--iOS--自定义UITableViewCell(含疑问)

    纯代码编写的简单自定义UITableViewCell: 1.像处理普通视图一样处理Cell: clsTableViewCell.h: #import <UIKit/UIKit.h> @in ...

  3. WPF 显示GIF动画

    简单的通过GifBitmapDecoder解析GIF图片,获取gif帧数和每一帧数据,然后通过时间切换显示,效果如下: 代码如下: namespace GIfImageApplication { pu ...

  4. MATLAB常用操作

    1.点乘,点除,点乘方 点乘(对应元素相乘),必须同维或者其中一个是标量,a.*b 点除,a.\b表示矩阵b的每个元素除以a中对应元素或者除以常数a,a./b表示常数a除以矩阵b中每个元素或者矩阵a除 ...

  5. Mac下git命令自动补全

    当我第一次在mac上安装git,[tab]补全装成功了,但是我没有记录,当我过一段时间在重装的时候,我已经忘记了,又是各种查资料,再次做一下简单的记录. 首先,我因为还是mac小白,所以使用Homeb ...

  6. loadRunner 负载机连接错误分析

    错误信息: Error: Process "lr_bridge.exe" was not created on remote host "192.168.86.17&qu ...

  7. python输入输出

    python 如何读取控制台输入的数据 比方说:从控制台读一个人的名字,赋给变量name   如下: name = input("name:") print(name) 如何读取一 ...

  8. Silverlight5中横向显示ListBox

    备忘 <ListBox x:Name="Cpbrow" HorizontalAlignment="Left" Height="153" ...

  9. Percona Server 5.6.13-61.0 首个 GA 版本发布

    Percona Server 5.6 的首个 GA 版本发布了,版本号是 5.6.13-61.0 ,该版本基于 MySQL 5.6.13 改进内容包括: New Features: Percona S ...

  10. 打开mysql时,提示 1040,Too many connections

    打开mysql时,提示 1040,Too many connections,这样就无法打开数据库,看不了表里边的内容了. 出现这个问题的原因是,同时对数据库的连接数过大,mysql默认的最大连接数是1 ...