クライアント用のページを作成しましたが、最初はChromeで作業していましたが、Firefoxで動作しているかどうかを確認するのを忘れていました。今、ページ全体がFirefoxで動作しないスクリプトに基づいているため、大きな問題があります。
これは、適切なページを非表示にして表示するrel
を持つすべての「リンク」に基づいています。 Firefoxでこれが機能しない理由がわかりません。
たとえば、ページには#menuPage
、#aboutPage
などのIDがあります。すべてのリンクにこのコードがあります:
<a class="menuOption" rel='#homePage' href="#">Velkommen</a>
ChromeおよびSafariで完全に機能しています。
コードは次のとおりです。
$(document).ready(function(){
//Main Navigation
$('.menuOption').click(function(){
event.preventDefault();
var categories = $(this).attr('rel');
$('.pages').hide();
$(categories).fadeIn();
});
// HIDES and showes the right starting menu
$('.all').hide();
$('.pizza').show();
// Hides and shows using rel tags in the buttons
$('.menyCat').click(function(event){
event.preventDefault();
var categori = $(this).attr('rel');
$('.all').hide();
$(categori).fadeIn();
$('html,body').scrollTo(0, categori);
});
});
イベントハンドラー(の一部)を誤って宣言しています:
$('.menuOption').click(function( event ){ // <---- "event" parameter here
event.preventDefault();
var categories = $(this).attr('rel');
$('.pages').hide();
$(categories).fadeIn();
});
ハンドラーのパラメーターとなるには、「イベント」が必要です。 WebKitは、「イベント」にグローバルシンボルを使用するIEの古い動作に従いますが、Firefoxは動作しません。 jQueryを使用している場合、そのライブラリは動作を正規化し、イベントハンドラーにイベントパラメーターが渡されるようにします。
編集 —明確にするために:someパラメーター名を指定する必要があります。 event
を使用すると、目的が明確になりますが、e
、cupcake
、またはその他の名前を呼び出すことができます。
また、「ネイティブ」パラメータ(ChromeおよびIEおよびSafari)の代わりにjQueryから渡されるパラメータを使用する必要がある理由は、そのパラメータ(パラメータ)であることに注意してください。は、ネイティブイベントオブジェクトのjQueryラッパーです。ラッパーは、ブラウザー全体でイベントの動作を正規化するものです。グローバルバージョンを使用している場合は、取得できません。
event
をclick
関数に渡すのを忘れたためです。
$('.menuOption').on('click', function (e) { // <-- the "e" for event
e.preventDefault(); // now it'll work
var categories = $(this).attr('rel');
$('.pages').hide();
$(categories).fadeIn();
});
ちなみに、e
はほとんどのブラウザでグローバル変数であるため、event
はWord Event
ではなく一般的に使用されます。