開発途中などで後から追記するリンクの代わりに、<a href="#">⋯</a>のようにa要素のhref属性に「#」などを使ったダミーリンクを入れておくことがよくありますが、これクリックするとページを再読み込みし、その結果トップに飛んでしまいます。この動作を無効にするhref属性の例をまとめてみました。

下側に実際の動作を確認するサンプルを置いています。（１）（２）は、飛んでしまうダミーリンク、（３）（４）は、飛ばないダミーリンク、（５）は、hoverなどを含むポインターイベントをすべて無効にします。

飛んでしまうダミーリンクのhref属性の例

• href=""（指定無し）
• href="#"

飛ばないダミーリンクのhref属性の例

• href="#x"（#に続けて存在しないID名）
• href="javascript:void(0)">（スクリプト）
• href="#" + css（ pointer-events:none ）ポインターイベント無効

動作確認サンプルのhtmlソース

<ul>
 <li><a href="">（１）href="" を使ったダミーリンク</a></li>
 <li><a href="#">（２）href="#" を使ったダミーリンク</a></li>
 <li><a href="#x">（３）href="#x" を使ったダミーリンク</a></li>
 <li><a href="javascript:void(0)">（４）href="javascript:void(0)" を使ったダミーリンク</a></li>
 <li><a style="pointer-events:none" href="#">（５）href="#" + cssでポインターイベント無効</a></li>
</ul>