1

マークアップで通常のリンクを使用するAJAXナビゲート可能なサイト（CSS-Tricksから取得したコード）を構築していますが、それらを.js経由のハッシュリンクに置き換えています。

同じコンテンツをリロードするだけのリンクをクリックできるようにしたくありません。私はハッシュを使用しているので、ホームページ以外のページ（最初のロード時）では、この問題は自動的に解決します（ユーザーが現在のURLハッシュのハッシュリンクをクリックしても何も起こりません）。

これを関数として定義するまで機能していたソリューションがありました（再利用する必要があるため）。$（this）を使用して、クリックされたリンクを取得し、現在のページへのリンクである場合はfalseを返しました。ただし、これにより、クリックされたリンクではなく、ウィンドウが（配列オブジェクトとして）返されます。

代わりにクリックしたリンクを選択するにはどうすればよいですか？

// Use hashes instead of reloads to navigate the site.
function initiateHashNav(linkContainers) {
  var $this = $(this);
  $(linkContainers).delegate('a', 'click', function() {
    // Restrict clicking on link for current page.
    if ($this.attr('href') == window.location.href) {
      return false;
    } else {
      // The hash shouldn't contain window.location (clean URLs are happy URLs!).
      window.location.hash = $this.attr('href').substr(window.location.origin.length);
      return false;
    }
  });
}
4

1 に答える 1

1

の宣言を次の$thisように正しいスコープに移動するだけです。

function initiateHashNav(linkContainers) {
  $(linkContainers).delegate('a', 'click', function() {
     var $this = $(this);
    // Restrict clicking on link for current page.
    if ($this.attr('href') == window.location.href) {
      return false;
    } else {
      // The hash shouldn't contain window.location (clean URLs are happy URLs!).
      window.location.hash = $this.attr('href').substr(window.location.origin.length);
      return false;
    }
  });
}

javascriptのすべての関数はスコープです。の各スコープにはコンテキスト（this）があり、コンテキストが設定されていない場合は、ウィンドウオブジェクトがコンテキストになります。

jQuery.fn.delegateは、一致した要素をイベントハンドラーのコンテキストとして設定します。したがってthis、デリゲートイベントハンドラー内のHtmlAncherElementです。ただし、関数の外部にはinitiateHashNavコンテキストが設定されていないため、ウィンドウオブジェクトにすぎません。

于 2012-05-16T04:24:39.093 に答える