如果我有以下简单的代码段:
<div ng-app="myApp">
<a ng-disabled='true' ng-click="value1=123">click me</a>
<button ng-disabled='true' ng-click="value2=123">click me</button>
=={{value1}}==
=={{value2}}==
</div>
从小提琴上可以看到:http://jsfiddle.net/basarat/czVPG/按钮是不可点击的,ng-click(这只是一个jquery on('click',function(){})
)不执行。但是,它会为锚标记执行。
- 是因为disabled不是锚标记的有效属性吗?
- 如果是的话,为什么它仍然会触发dom click事件,而按钮却不会?
7条答案
按热度按时间aydmsdu91#
读取w3c Link和-a-元素
disable对锚标记无效
你可以通过event.preventDefault()来实现
llew8vvj2#
Disabled不是锚标记的有效属性。来源:http://dev.w3.org/html5/html-author/#the-a-element
mi7gmzs63#
如果你不想使用JavaScript来禁用锚(就像在其他响应中提出的那样),你可以只省略
href
属性,锚就不会工作,甚至会改变它的样式。注意:我知道我的回答没有直接讨论
disable
属性,但这些信息可能对听众有用,就像对我一样。6ss1mwsb4#
不,它不适用于
a
标记,您可以使用jqueryevent.preventDefault()
referance herejdgnovmf5#
按钮是一个输入类型,这就是为什么禁用工作。两个人的工作原理不一样。试着给你的a标签一个id并禁用JavaScript。
之后可以使用js禁用元素,它应该像输入类型一样工作。
确保您获得了元素的正确客户端ID。
utugiqy66#
如果以后要启用锚,那么在您实际上想要禁用它时删除href或将其设置为“#”是一种痛苦,因为您需要将href重置为它应该链接到的任何值。相反,我只是向标记添加了一个disable属性、一个click事件处理程序和一些css。这样,可以很容易地看到锚被禁用,但如果启用,它将去哪里。
是的,disabled是锚标签不支持的属性,但是CSS属性选择器可以找到它,jQuery也可以。因此,虽然下面的解决方案是一个混合的jQuery/javaScipt/CSS,它确实提供了一个更好的方式来禁用/启用锚,它支持动态添加/删除禁用属性到标记JavaScript/从标记。请注意,这只是经过测试,并发现在Chrome中工作。
下面是一个codePen演示:https://codepen.io/howardb1/pen/XWrEKzP
mnowg1ta7#
很遗憾不可能。
另一个不错的选择是使用CSS!在那个被禁用的链接上打一个班!
More on CSS Pointer events here (MDN Web Docs)