jQuery works in Firefox when Firebug is running, does not work when Firebug is NOT running

Question

I have the following Javascript libraries loaded for my page.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.1.2/jquery.tools.min.js"></script>
<script type="text/javascript" src="./js/jquery.scrollTo-min.js"></script>

I have the div element that I want to place them in:

<div class="content" id="content">
</div>

I have this link:

<a id="changeText" href="rules.html">Click to change</a>

Finally, I have the following jQuery code:

<script>

$(document).ready(function() {
 $("#changeText").click(function(){

  var url = $(this).attr("href");

  $("#content").load(url);

  console.log(url);

  $.scrollTo("0%", 400);
 });
});
</script>

This all works in Safari. The oddest part of the story is that it only works in Firefox when Firebug is on. When Firebug is NOT on, the page seems to be dynamically loaded, but then the page loads rules.html and switches to it, which is not my desired goal.

Also, of course, none of this works in IE8.

What am I doing wrong?

Answer 1

You'd better wrap all your

console.log(...) 

into

if (window.console) {
    console.log(...);
}

Answer 2

Take out the console.log, it is undefined when firebug is not running.

Answer 3

You can use the following code to mask missing logging functions.

if (typeof console === "undefined") {
    var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
    "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];

    window.console = {};
    for (var i = 0; i < names.length; ++i)
        window.console[names[i]] = function() {}
}

Answer 4

Check to see if you have a console before trying to use it.

Bind a Boolean variable so:

var hasConsole = (typeof console != 'undefined' && typeof console.log != 'undefined');

And check it before writing to the console:

   if (hasConsole) {
      console.log("This is safe.");
   }

This way when you turn on Firebug you get your debug messages and when you turn it off your scripts still work.