javascript禁用边框半径单击事件

Question

我想禁用边框字段的click事件。 为什么边框是可点击的，我该如何解决？

.circle {
    border-radius: 100px;
}

span {
    display: block;
    background: #000;
    width: 200px;
    height: 400px;
    border-radius: 100px;
}

JS小提琴演示

谢谢。

Answer 1

您可以解决使用CSS这种不良影响，因为用户没有在点击span元素，但在a （即没有border-radius ）。

为了解决这个问题，只需删除span元素及其样式，然后为a元素设置样式：

a {
    display:block;
    background:#000;
    width:200px;
    height:400px;
    border-radius:100px;
}

工作演示 。

该怎么示范a区域可能会影响你的代码 。

Answer 2

这是不可能的，至少没有很多非常复杂的数学来确定单击是在元素内部还是在曲线之外。

记住元素有盒子模型。 因此，即使您将它们弯曲，它们仍会被浏览器视为方框，并在DOM中表示为方框。 如果不是，则周围的元素会渗入边界半径所腾出的空间中，这不会发生。