29

さまざまなリンクがあり、それらはすべて「疑似アンカー」である一意のIDを持っています。私はそれらがurlハッシュ値に影響を与えることを望みます、そしてクリックマジックはすべていくつかのmootoolsコードによって処理されます。ただし、リンクをクリックすると、リンク自体（または場合によっては一番上）にスクロールします。どこにもスクロールしたくありませんが、JavaScriptを実行して、URLの更新にハッシュ値を含める必要があります。

シミュレートされたサンプルコード：

<a href="#button1" id="button1">button 1</a>
<a href="#button2" id="button2">button 2</a>
<a href="#" id="reset">Home</a>

したがって、「ボタン1」リンクをクリックすると、URLはhttp://example.com/foo.php#button1になります。

誰かがこれについて何かアイデアがありますか？javascriptを返すだけでvoidを返すと、スクロールが強制終了されますが、javascriptも強制終了されます（ただし、onclickで回避できる可能性があります）が、さらに重要なのは、URLのハッシュ値が変更されないようにすることです。

4

8 に答える 8

36

アンカーリンクの要点は、ページを特定のポイントまでスクロールすることです。したがって、それを望まない場合は、onclickハンドラーをアタッチしてfalseを返す必要があります。属性として追加するだけでも機能するはずです。

<a href="#button1" id="button1" onclick="return false">button 1</a>

上記の副作用として、falseを返すとイベントがキャンセルされるため、URL自体は変更されません。したがって、URLを実際に変更する必要があるため、window.location.hash変数を必要な値に設定できます（これは、ブラウザーがリロードを強制せずに変更できるURLの唯一のプロパティです）。window.location.hash = this.idmootoolsがイベントをどのように処理するかはわかりませんが、おそらくイベントハンドラーをアタッチして、次のようなものを呼び出すことができます。

（また、すべてのIDが一意である必要があります）

于 2009-08-02T02:47:56.510 に答える
25

以下のコードを使用して、スクロールを回避できます。

<a href="javascript:void(0);">linktxt</a>
于 2013-04-04T14:27:21.987 に答える
9

私はおそらく何かが足りないのですが、なぜ彼らに異なるIDを与えないのですか？

<a href="#button1" id="button-1">button 1</a>
<a href="#button2" id="button-2">button 2</a>
<a href="#" id="reset">Home</a>

またはあなたが好むどんな慣習でも。

于 2009-08-02T02:44:20.353 に答える
5

また、preventDefault

    $(your-selector).click(function (event) {
        event.preventDefault();
        //rest of your code here
    }
于 2013-12-06T03:21:10.150 に答える
3

私は解決策を見つけました。ここでは、hrefを呼び出さないように古い場所を保存し、スクロール後に復元します

<script language="JavaScript" type="text/javascript">
<!--
function keepLocation(oldOffset) {
  if (window.pageYOffset!= null){
    st=oldOffset;
  }
  if (document.body.scrollWidth!= null){
    st=oldOffset;
  }
  setTimeout('window.scrollTo(0,st)',10);
}
//-->
</script>

とページの本文

<a href="#tab1" onclick="keepLocation(window.pageYOffset);" >Item</a>

サイトポイントのおかげで

于 2013-06-25T04:13:33.023 に答える
1

より簡単な方法は、おそらくそれをGETとして追加することです。つまり、http://example.com/foo.php?q=#button1代わりにhttp://example.com/foo.php#button1

これは、ページの表示方法には影響しません（必要な場合を除く）。ほとんどのスクリプト言語には、データを簡単に（そして安全に）読み取るためのツールがすでに用意されています。

于 2009-08-02T03:14:41.897 に答える
0

この回答が公開されてから7年が経ちましたが、これを機能させる別の方法を見つけました。window.location.hashを存在しないアンカーにポイントするだけです。sでは機能しません<a>が、sでは完全に機能し<div>ます。

<div onclick="window.location.hash = '#NonExistentAnchor';">button 1</div>

Chrome 56、Firefox 52、Edge（IE？）38で正常に動作しました。もう1つの良い点は、コンソールエラーや警告が発生しないことです。

それが私以外の誰かに役立つことを願っています。

于 2017-03-21T03:26:53.133 に答える
0

JavaScriptをまったく使用しないソリューションがあります。

<a href="#!">I will not jump to the top</a>
于 2021-04-13T20:54:13.023 に答える