2

私のサイトではすべてが完全に機能していますが、何らかの理由で、サイトのどこかのリンクをクリックするたびにコンソールにエラーメッセージが表示されます。エラーは、ここでのコーディングの次の行に関係しています。

jQuery(function($){
  $('.navbar a, .scroll a, .smoothscroll a').bind('click',function(event){
    var $anchor = $(this);

    $('html, body').stop().animate({
        scrollTop: $($anchor.attr('href')).offset().top
    }, 850,'easeInOutExpo');

    event.preventDefault();
  });
});

そして、私が得ているエラーはこれです:

"SCRIPT5007:プロパティ'top'の値を取得できません:オブジェクトがnullまたは未定義のcustom.min.js、6行目の文字197"

強調表示されている正確なコードは、上記のコードのこの部分です。

$('html, body').stop().animate({
  scrollTop: $($anchor.attr('href')).offset().top
}, 850,'easeInOutExpo')

私が知っているのは、上記のコードを削除すると、スクロール先のリンクが次のようなページで機能しなくなることだけです。

http://www.northtownsremodeling.com/things-to-know.php

次のようなフィルターを使用してページに移動すると、ポップアップエラーが発生し、コンソールにとどまることが簡単にわかります。

http://www.northtownsremodeling.com/bathroom/

そして、フィルターボタンの1つをクリックします。

最終的には、スクロール先の設定が引き続き機能するようにしようとしていますが、そのエラーは発生しなくなりました。私はずっと前にこのスクリプトを作成しましたが、他のすべてが完全に機能しているときにこのエラーを引き起こす原因について本当に混乱していますか?

ありがとう!

4

2 に答える 2

5

あなたが持っている問題は、エラーを与えるコードが事前定義されたdivにスクロールするためのものであり、そのID(ターゲットdivの)がurlのハッシュタグ(クリックされたリンクのhref属性)にあることです。

これは、「通常の」リンクをクリックすると問題になります。これは、ページに存在する要素のIDであるハッシュタグが含まれていないため、$($anchor.attr('href'))空の配列を提供します。つまり、で選択できる要素がない$("http://www.northtownsremodeling.com/alliances.php")ため、この場合はオフセットです。 ()は未定義であり、エラーが発生します。

これを修正するには、次を置き換えます。

$('html, body').stop().animate({
    scrollTop: $($anchor.attr('href')).offset().top
}, 850,'easeInOutExpo');

と:

// get target div to scroll to
var target = $($anchor.attr('href'));
// if target is valid, scroll to
if(target && target.offset()){
    $('html, body').stop().animate({
        scrollTop: target.offset().top
    }, 850,'easeInOutExpo');
}
于 2012-09-19T03:34:34.343 に答える
1

デモ: http: //jsfiddle.net/SWgYD/

href属性に正しいセレクターが含まれていないからだと思います。リンクがidのブロックに一致する場合、navリンクのhref属性は。である必要があります#nav

イベントハンドラーはナビゲーションリンクにのみバインドする必要があります。

于 2012-09-19T03:33:04.050 に答える