何もしないリンクを作成することは可能ですか?アイテムをリンクにしたいので、マウスオーバーでカーソルを変更できますが、同じページで追加機能を備えたdivの表示を実際にトリガーするため、リンクが実際にどこにも行かないようにします。
ブラウザの履歴に追加します:
<a href="#"></a>
ブラウザの履歴に追加しない(推奨される方法):
<a href="javascript:;"></a>
代わりに、<span>
を使用してカーソルスタイルを設定できます。
<span id="node42" class="node-link">My Text</span>
そしてスタイルシートでカーソルを指定します:
.node-link { cursor: pointer; }
これにより、後でアクションのためにノードにアタッチすることもできます( Prototype を使用してここに表示):
<script type="text/javascript">
$('node42').observe('click', function(event) {
alert('my click handler');
});
</script>
私の意見では、最も完全なハックフリーソリューション:
<a href="" onclick="return false;">do absolutely nothing</a>
スタイルを追加するだけでcursor:pointer
要素に:
<a id="clickme">Click Me</a>
CSS:
#clickme { cursor: pointer }
または(天国では禁止)インライン:
<a style="cursor:pointer">Click Me</a>
以下に、2つのclassic javascriptアプローチを示しますエラーを表示しないでJS-console =および/またはURLを変更せず、ブラウザの履歴に保存しない:
<a href="javascript:void(0);">Click on this javaScript error-free link that won't change your URL nor save it into your browser history</a><hr />
<a href="#void">Maybe a more readable approach, but unfortunately this one changes your URL</a>
スタイルだけが必要な場合は、CSS cursor property をポインターに設定します。
ただし、<a href="javascript:void(do_something())">
が必要なようです。
1つのオプションは#someidを指すことです-それはその要素に垂直スクロールしますが、それはあなたが望むものであるかもしれません。
追伸スタイルを使用しても同じ結果を得ることができます。
もっとシンプルなものを探していましたが、見つけたと思います。リンクをどこにも行かないようにしたいですか? href
を省略します。
<a class='irrelevant_for_this_example'>Some text</a>
href="#"
は、ページの上部までスクロールします。
href="javascript:;"
は危険なようです。
JSソリューションは、単純なものには不要のようです。