Question

97

ReferenceError: event is not defined error in Firefox

rated 0 times [ 100] [ 3] / answers: 1 / hits: 147888 / 11 Years ago, wed, december 11, 2013, 12:00:00

I've made a page for a client and I initially was working in Chrome and forgot to check if it was working in Firefox. Now, I have a big problem because the whole page is based upon a script that doesn't work in Firefox.

It's based on all links that have a rel that leads to hiding and showing the right page. I don't understand why this isn't working in Firefox.

For instance pages have the id #menuPage, #aboutPage and so on. All links have this code:

<a class=menuOption rel='#homePage' href=#>Velkommen</a>

It's working perfectly in Chrome and Safari.

Here is the code:

$(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);



    });





});

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

marvinm

Add To Favorites

Follow

Total Points: 406

Total Questions: 104

Total Answers: 121

Location: Iceland

Member since Tue, Jan 25, 2022

2 Years ago

answered 11 Years ago tayla · Accepted Answer

You're declaring (some of) your event handlers incorrectly:

$('.menuOption').click(function( event ){ // <---- event parameter here



    event.preventDefault();

    var categories = $(this).attr('rel');

    $('.pages').hide();

    $(categories).fadeIn();





});

You need event to be a parameter to the handlers. WebKit follows IE's old behavior of using a global symbol for event, but Firefox doesn't. When you're using jQuery, that library normalizes the behavior and ensures that your event handlers are passed the event parameter.

edit — to clarify: you have to provide some parameter name; using event makes it clear what you intend, but you can call it e or cupcake or anything else.

Note also that the reason you probably should use the parameter passed in from jQuery instead of the native one (in Chrome and IE and Safari) is that that one (the parameter) is a jQuery wrapper around the native event object. The wrapper is what normalizes the event behavior across browsers. If you use the global version, you don't get that.