jQuery - Uncaught reference: function not defined

Question

I get an "Uncaught ReferenceError: resizeRefresh is not defined" error whenever I resize my browser window. Does anyone know what I've been doing wrong, since I can't seem to find it myself...

$( document ).ready(function() {

    $(window).resize( function() {
        resizeRefresh();
    });

    $(function resizeRefresh() {
        // Code to run (everything is fine)
    });

});

Answer 1

Because you don't define functions like that, define it as follows:

function resizeRefresh(){
// Code 
}

or even

var resizeRefresh = function(){
// Code 
}

Edit To elaborate, the dollar sign $ is an alias to the jQuery object. You can replace the dollar sign with jQuery if you were so inclined. Since you're not using a jQuery method or property, there was no need for the $.

More Info

Why does JQuery have dollar signs everywhere?

Why would a JavaScript variable start with a dollar sign?

When/why to prefix variables with "$" when using jQuery?

Answer 2

Your code has several issues:

1. Function definition is wrong. The function should be defined as var fnName = function(){};, not with jquery notation
2. If you are using a variable, you should define and initialize it BEFORE using it, and not after. This would probably not cause problems in your use case since the event will be triggered after the function will be defined, but it's very bad coding and might cause problems for other \ general use cases.

Corrected code:

$( document ).ready(function() {
    var resizeRefresh = function() {
        // Code to run (everything is fine)
    };

    $(window).resize( function() {
        resizeRefresh();
    });
});