我正在尝试禁用特定链接并应用光标样式,但这个 CSS 命令cursor: text;不会生效。光标始终是默认值。我正在使用最新的 Firefox 版本。
CSS：
pointer-events: none !important;
cursor: text;
color: Blue;
157
使用pointer-events: none将disable all mouse interactions与该元素一起使用。如果要更改cursor属性，则必须将更改应用于父元素。您可以用元素包装链接，然后向其中添加cursor属性。
<span cl="wrapper">
<a href="#">Some Link</a>
</span>
.wrapper {
position: relative;
cursor: text; /* This is used */
}
.wrapper a {
pointer-events: none;
}
有一些浏览器不一致,虽然。要在 IE11 中做到这一点,似乎你需要一个伪元素。伪元素还允许您选择 FF 中的文本。奇怪的是,您可以在 Chrome 中选择文本而无需它。
Updated Example.wrapper:after {
content: '';
position: absolute;
width: 100%; height: 100%;
top: 0; left: 0;
}
这是 pretty 很长，因为原来的问题，但这是我的解决方案没有任何包装元素和光标没有指针事件：
<!-- Add tabindex="-1" so that element cannot be reached by keyboard -->
<a href="url" aria-disabled="true" tabindex="-1" onfocus="blur()">Disabled link</a>
CSS：
/* Adding cursor just works: */
a[aria-disabled="true"] {
cursor: not-allowed;
}
/* Makes link non-clickable: */
a[aria-disabled="true"]:active {
pointer-events: none;
}
Chrome 已经开始在具有 tabindex 属性的元素上添加焦点（即使 tabindex =“-1”）。最快的解决方案是将onfocus="blur()"设置为 unfocus 元素。
您需要防止聚焦元素，否则它可以通过输入键激活
EDIT2将cl="disabled"替换为aria-disabled="true"以满足 a11y;)
13
通过指定pointer-events:none，您可以主动声明元素和光标之间没有鼠标交互。因此，它也不能有光标-所有鼠标行为都不可见。
4
删除pointer-events: none !important;。使用 JavaScript 禁用链接：
anchorElement.onclick = function(){
return false;
}
如果您不知道 JavaScriptanchorElement是 Node 或 Element 本身。获取 Element 的最常见方法是使用 HTMLid属性。假设我们有:
<a id='whatever' href='#'>Text Here</a>
您的代码可能是：
document.getElementById('whatever').onclick = function(){
return false;
}
还有许多其他方法来获取节点。
本站系公益性非盈利分享网址，本文来自用户投稿，不代表码文网立场，如若转载，请注明出处
评论列表（31条）