jQuery: try catch { call function } does not work?

Question

I'm having a lot of JavaScript on my page and I'm using typekit. In order to make my page work correctly (grid and stuff) I'm using the new typekit font events.

It's simply a try and catch statement that checks if fonts get loaded or not. However somehow I'm not getting it. I'm calling the setGrid() function if typekit fonts are loaded, but e.g. iPad or iPhone doesn't support that yet and so my page doesn't get properly shown when I don't call the setGrid() function.

Anyway, I want to call the function in the error statement as well, so if the page is called on the iPhone, the page works without webfonts as well.

try {
 Typekit.load({
  loading: function() { },
  active: function() { setGrid(); },
  inactive: function() { }
 })
} catch(e) {
 alert('error'); //works
 setGrid(); //doesn't get called
}

However, the alert works, the setGrid() function doesn't get called. Any ideas?

edit: the function looks like that:

var setGrid = function () {
 $('#header, #footer').fadeIn(500);
 return $("#grid").vgrid({
  easeing: "easeOutQuint",
  time: 800,
  delay: 60
 });
};

Answer 1

Try making it "real" function, like this:

function setGrid() {
  $('#header, #footer').fadeIn(500);
  return $("#grid").vgrid({
    easeing: "easeOutQuint",
    time: 800,
    delay: 60
  });
};

Answer 2

The function does get called, but it just doesn't work as you expected causing you to think that it isn't getting called. You can see that it is getting called by adding an alert as the first line of setGrid.

jsfiddle link

Answer 3

Can you:

• try/catch around setGrid, too
• alert after setGrid to confirm it's getting through setGrid