使用pointer-events禁用事件触发

pointer-events:none使元素永远不会成为鼠标事件的target。但是，当其后代元素的pointer-events属性指定其他值时，鼠标事件可以指向后代元素，在这种情况下，鼠标事件将在捕获或冒泡阶段触发父元素的事件侦听器。

通过pointer-events:none禁用事件触发(默认事件、冒泡事件、鼠标事件、键盘事件等)，相当于<button>的disabled。使用场景如：限时点击按钮(发送验证码倒计时)、事件冒泡禁用(多个元素重叠且自带事件、a标签跳转)

<a class="disabled-trigger" href="https://www.xinran001.com">点我</a>

.disabled-trigger {
    padding: 0 20px;
    border-radius: 10px;
    height: 40px;
    background-color: #f60;
    pointer-events: none;
    line-height: 40px;
    color: #fff;
}

上方的a标签点击不会跳转。