button按钮的状态为disabled禁用状态，click事件无法触发，但是为什么touchstart下却依然可以触发
切换到移动模拟模式，并点击按钮，查看控制台。
发现click没有事件没有触发，而touch事件依然触发。
解决办法：
对于移动端我们使用css来禁止按钮，达到disable的效果:
对，就是这个神奇的pointer-events属性！回忆一下，很早前就看到过这个属性，不过当时并没有进入到移动端的开发领域，对它的作用并没有过多关注。我们来看一下mdn上怎么说的：
auto 是默认值。
设置pointer-events:none的元素，将不会成为事件目标。但是如果其子孙元素设置了pointer-events:auto，该子孙元素仍然可成为事件目标，并且如果该事件支持冒泡，其设置了pointer-events:none的祖先元素，也会由于冒泡触发相应的监听事件。
又是IE拖后腿了囧，不过移动端表现良好~
总结
pointer-events这个CSS3属性，在移动端我们基本可以“放肆”的使用，在你需要禁用某个元素事件或某个区域事件的时候，可以考虑下这个属性，简单高效~
嗯，终于搞明白这个属性了！
button按钮的状态为disabled禁用状态，click事件无法触发，但是为什么touchstart下却依然可以触发的更多相关文章
- Winform中使用代码编写Button按钮的点击事件
场景 一般在进行Winform窗体开发时都会拖拽一个Button,然后双击进入Button按钮的点击事件中,进行 点击事件的编写. 如果窗体上事先没有Button按钮,是在代码中生成的Button按钮 ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：禁用状态
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Bootstrap系列 -- 20. 禁用状态
Bootstrap框架的表单控件的禁用状态和普通的表单禁用状态实现方法是一样的,在相应的表单控件上添加属性“disabled” 在使用了“form-control”的表单控件中,样式设置了禁用表单背景 ...
- Bootstrap 表单控件状态(禁用状态)
Bootstrap框架的表单控件的禁用状态和普通的表单禁用状态实现方法是一样的,在相应的表单控件上添加属性“disabled”.和其他表单的禁用状态不同的是,Bootstrap框架做了一些样式风格的处 ...
- Thinkpad 笔记本VMware Workstation 安装虚拟机出现“此主机支持 Intel VT-x，但 Intel VT-x 处于禁用状态”解决方法
今天在使用VMware打算在机器中安装新的虚拟机时,出现"此主机支持 Intel VT-x,但 Intel VT-x 处于禁用状态"错误如下: 提示信息: 已将该虚拟机配 ...
- VMware安装64位操作系统提示Intel VT-x处于禁用状态的解决办法
用VMware安装64位操作系统时,如果目前本地的操作系统是64位的,那么可以说明CPU是肯定支持64位的,这时候如果提示此主机支持 Intel VT-x,但 Intel VT-x 处于禁用状态.这个 ...
- 解决虚拟机vmware安装64位系统“此主机支持 Intel VT-x，但 Intel VT-x 处于禁用状态”的问题
虚拟机使用的是VMware Workstation,并且首次在虚拟机体验64 位系统.在新建好虚拟机,运行时候就出现了VMware Workstation 的提醒:此主机支持 Intel VT-x,但 ...
- Vmware报错：此主机支持IntelVTx 但IntelVTx处于禁用状态
"此主机支持IntelVTx 但IntelVTx处于禁用状态",报错原因:电脑未开启虚拟化 解决方案: 电脑关机(是关机不是重启)--开机,进BIOS --选择 configura ...
- “此主机支持 Intel VT-x，但 Intel VT-x 处于禁用状态”的问题的解决
虚拟机使用的是VMware Workstation,并且首次在虚拟机体验64 位系统.在新建好虚拟机,运行时候就出现了VMware Workstation 的提醒:此主机支持 Intel VT-x,但 ...
随机推荐
- 网络时间同步服务和chrony
时间同步和chrony 时间同步:多主机协作工作时,各个主机时间同步很重要,时间不一致会造成很多重要应用的故障,如:加密协议,日志,集群等, 利用NTP(Network Time Protocol) ...
- 微信小程序API~检查登录状态
wx.checkSession(Object object) 检查登录态是否过期. 通过 wx.login 接口获得的用户登录态拥有一定的时效性.用户越久未使用小程序,用户登录态越有可能失效.反之如果 ...
- DFS遍历拷贝所有子文件夹及目录列表 (Java版)
如题 注意,文件夹是不能拷贝的, 需要mkdir的 文件选择合适的流进行拷贝 main测试方法 /** * 主测试类,默认将D:\\base01 下的复制到D:\\base02 * @param ar ...
- vue 标签页以及标签页赋值
背景: 使用vue增加了标签页,点击不同标签页传给后端的值不一样,用来做区分,如图: vue代码如下: 使用 form.PageA form.PageB ,后端接收到的值 first.second ...
- TJOI2016 字符串
字符串 佳媛姐姐过生日的时候,她的小伙伴从某东上买了一个生日礼物.生日礼物放在一个神奇的箱子中.箱子外边写了一个长为n的字符串s,和m个问题.佳媛姐姐必须正确回答这m个问题,才能打开箱子拿到礼物,升职 ...
- oracle中日期相关的区间
and czrqb.lsrqb_rh_sj >= to_date('[?query_date_begin|2011-09-01?]A', 'yyyy-mm-dd') and czrqb.lsrq ...
- 结构型模式(二) 桥接模式（Bridge）
一.动机(Motivation) 在很多游戏场景中,会有这样的情况:[装备]本身会有的自己固有的逻辑,比如枪支,会有型号的问题,同时现在很多的游戏又在不同的介质平台上运行和使用,这样就使得游戏的[装备 ...
- maven中profile的使用
转载:https://blog.csdn.net/java_collect/article/details/83870215 前言 在开发过程中,我们的项目会存在不同的运行环境,比如开发环 ...
- C++创建对象的3种方式（转载）
#include <iostream> using namespace std; class A { private: int n; public: A(int m):n(m) { } ~ ...
- select下拉选中显示对应的div隐藏不相关的div
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...