Function in not define on resize

Question

I have made this code to resize ALL divs when one div is greater than other divs. The code executes on load then I want my nested function to work when window resizes. I am getting an error that resizeAgain() is not defined.

Updated: Forgot callback: sameSize('.content', '.col1', '.col2');

    <body onresize="resizeAgain()">
         function sameSize(e, selector1, selector2) {

        var slave = $(selector1).height();
        var master = $(selector2).height();
        var maxHeight = Math.max(slave, master);

        $(e).height(maxHeight);

        function resizeAgain() {
            $(e).css('height','');
            $(e).height(maxHeight);
        }
        sameSize('.content', '.col1', '.col2');

This code has a syntax error. My bet is that this is a scope error. — Lee Brindley, Jan 23 '17 at 15:23
I forgot the callback function sameSize('.content', '.col1', '.col2'); — Darth Vader, Jan 23 '17 at 15:23
I agree with Lee, but you should update your code first. The code provided is not correct. It misses brackets. — NikxDa, Jan 23 '17 at 15:23
Remove document.ready from within your resize function. It's used to init things on startup and shouldn't be used inside functions that aren't called on startup. — Shilly, Jan 23 '17 at 15:26
Not really. It's still not syntactically correct. Just post your complete code. — NikxDa, Jan 23 '17 at 15:26
the function `resizeAgain` is only visible inside the scope of the `sameSize` function — Olivier Boissé, Jan 23 '17 at 15:29

score 0 · Answer 1 · edited May 23 '17 at 12:16

0

The function resizeAgain() is defined in sameSize(e, selector1, selector2) and this changes its scope making it inaccessible outside sameSize(..).

You can find more information at this other answer: javascript-nested-function

edited May 23 '17 at 12:16

Community

1
1

answered Jan 23 '17 at 15:29

Roberto Russo

834
10
22

score 0 · Accepted Answer · answered Jan 23 '17 at 15:37

The function resizeAgain is only visible inside the scope of the sameSize function, that's why you have an error when you call it from the window scope.

You can define this function in the global scope :

<body onresize="resizeAgain('.content')">

function resizeAgain(e) {
  $(e).css('height','');
  $(e).height(maxHeight);
}

function sameSize(e, selector1, selector2) {
   var slave = $(selector1).height();
   var   master = $(selector2).height();
   var  maxHeight = Math.max(slave, master);
   $(e).height(maxHeight);
}

sameSize('.content', '.col1', '.col2');

Function in not define on resize

2 Answers2