替代href =“＃”保留鼠标悬停属性

Question

我有一个很长的HTML页面，在模态打开页面滚动到顶部，可以通过删除href =＆＃34;＃＆＃34;来自

<a href="#" id="myId">Click me to open modal</a>

但删除它，它会改变鼠标移动显示＆＃34; hand＆＃34; on anchor tag to＆＃34; text blinker＆＃34;。

如何在不丢失该属性的情况下摆脱href="#"？

Answer 1

集

cursor:pointer;

<{1}}元素

上的

Answer 2

选项1：

而不是：

<a href="#" id="myId">Click me to open modal</a>

尝试：

<a href="javascript:void(0);" id="myId">Click me to open modal</a>

这会将<a>标记视为具有默认CSS样式的正确锚点，但不会执行导致浏览器滚动到顶部的默认链接行为。

选项2：

在您的javascript中使用event.preventDefault()，以防止浏览器滚动到顶部。

选项3：

完全删除href属性，并将cursor: pointer添加到您的CSS中。

Answer 3

您可以阻止锚定默认行为，在JS中设置event.preventDefault()。

我不知道您的代码是怎样的，但这里有一个jQuery example：

<a href="http://jquery.com">default click action is prevented</a>
<div id="log"></div>


<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
 $( "a" ).click(function( event ) {
   event.preventDefault();
   $( "<div>" )
     .append( "default " + event.type + " prevented" )
     .appendTo( "#log" );
});
</script>

Answer 4

如果要打开空白链接，请使用以下URL：“about：blank”