web-dev-qa-db-ja.com

クリックしたときにページが「ジャンプ」しないように、空のHTMLアンカーを作成するにはどうすればよいですか？

リンクをクリックするとコンテンツを非表示/表示するために、私はいくつかのJQueryに取り組んでいます。私は次のようなものを作成できます：

<a href="#" onclick="jquery_stuff" />

しかし、ページを下にスクロールしているときにそのリンクをクリックすると、ページの上部に戻ります。

私が次のようなことをした場合：

<a href="" onclick="jquery_stuff" />

ページが再読み込みされ、javascriptが行ったすべての変更がページから削除されます。

このようなもの：

<a onclick="jquery_stuff" />

希望する効果が得られますが、リンクとして表示されなくなりました。空のアンカーを指定して、ページ上の何かを変更したりスクロールバーを移動したりせずに、onclickイベントにjavascriptハンドラーを割り当てる方法はありますか？

javascriptjqueryanchor
61
Alex Fort

「falseを返す」を入れます。 2番目のオプション：

<a href="" onclick="jquery_stuff; return false;" />
79
Otávio Décio

必要がある return false; 後に jquery_stuff：

<a href="no-javascript.html" onclick="jquery_stuff(); return false;" />

これにより、デフォルトのアクションがキャンセルされます。

24
Greg

以下のように簡単に配置できます。

<a href="javascript:;" onclick="jquery_stuff">
23
Shiva Srikanth Thummidi

jQueryにはpreventDefaultという関数が組み込まれています。この関数は次の場所にあります。 http://api.jquery.com/event.preventDefault/

以下に例を示します。

<script>
$("a").click(function(event) {
    event.preventDefault();
});
</script>

次のようなリンクを作成することもできます。

<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
19
nates

まぶたの無さを確認してください（アンカーではなくボタンを使用してください）。ちょうど同じアドバイスを投稿しようとしていた。リソースにリンクせず、単にスクリプトを実行するアンカーは、ボタンとして実装する必要があります。

イベントハンドラをHTMLに配置するのをやめ、アンカーセマンティックの目的を果たさないアンカータグの使用をやめます。ボタンを使用して、JavaScriptにクリックハンドラーを追加します。例：HTML _<button id="jquery_stuff">Label</button>_およびJavaScript $('#jquery_stuff').click(jquery_stuff);。 CSSを使用して、パディング、境界線、マージン、および背景色を削除し、リンクスタイル（色やテキスト装飾など）を追加することで、ボタンをリンクのようにスタイル設定できます。 –まぶたのない10年10月19日17:40

6
Chris
<a href="javascript:;" onclick="jquery">link</a>

hrefには、htmlのバリデーターでエラーをポップアップさせたくない場合に、そこに何かが必要です。 javascript:;は適切なプレースホルダーです。

本当に#を使用したい場合：

<a href="#me" name="me" onclick="jquery">link</a>

return false;に注意してください。これは、実行中のすべてのデフォルトの動作を停止します。

また、jsが送信のようなものである場合、Internet Explorerで問題が発生する可能性があります。

4
Dean
<a href="javascript:// some helpful comment " onclick="jquery_stuff" />
0
Diodeus - James MacFarlane