如果CSS中的 pointer-events 属性,设置其值为 none 的话,可以禁止 button 元素被点击,并且也可禁止其 JS 点击事件。

CSS pointer-events 属性

pointer-events:设置元素是否对指针事件做出反应

语法:

pointer-events: auto|none;

可选值:

auto:默认值,可以 :hover 和 click 做出反应。

none:元素不可点击,禁止所有事件

CSS 禁止button点击事件

示例:

<button>这是可点击的</button>
<button style="pointer-events:none">这是不可点击的</button>

示例图:

CSS实现禁止button元素被点击的方法

示例2:

CSS pointer-events 属性也可以禁止button的JS点击事件。

<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
<button>这是可点击的</button>
<button style="pointer-events:none">这是不可点击的</button>
<p>飞鸟慕鱼博客</p>
<script>
$('body').on('click','button',function(){
alert('sss');
});
</script>