error var is not defined -but its defined before used-

this code

    $(document).ready(function(){
                            var wBack = $('ul li.roundabout-in-focus').height();
                            var hBack = $('ul li.roundabout-in-focus').width();
                            var lback = $('ul li.roundabout-in-focus').css('left');
                            var tback = $('ul li.roundabout-in-focus').css('top');
    });
    function close_current(){
                    $('.nInfoIE').show();
                        $('.roundabout-in-focus').find('.img').show();
                        $('.roundabout-in-focus').css({position:'absolute',height:hBack,width:wBack,left:lBack,top:tBack});
                        $('.roundabout-in-focus').find('.iframe').css({'visibility':'hidden'});
                        $('ul li').find('.iframe').addClass('esconder');

                        $('ul li iframe').each(function(){
                            var tempurl = '';
                            tempurl = $(this).attr('src');
                            $(this).attr('src',tempurl.replace('?autoplay=1', ''));
                        });
                        watching = false;
                        开发者_运维技巧$('.nInfoIE').hide();
 }

prompts an error by firebug alerting that hBack is not defined, as you can see is defined on document.ready and the function is executed onClick an element...

-edit-

even tried to add var wBack ,hBack,lback,tback = 0; before document.ready and removing the single 'var' inside document.ready

what am i missing?

---

You've defined the variables inside the "ready" handler function. That means that they're private to that function and not visible outside it.

You could make them visible by explicitly making them window properties:

  window['hBack'] = whatever;

or you could put your "closeCurrent" function inside the "ready" handler too, so long as it's only referenced by code within the handler.

---

In one word, scope. Declare your variables outside the $(document).ready function to get them into the global scope, and then set them inside the function.

var wBack, hBack, lback, tback;
$(document).ready(function () {
    wBack = ...

---

this is a scope issue.

the other answers here will technically work, but i'd never advise to keep those vars global if you don't need them globally.

you are defining wBack, hBack, lBack, and tBack inside the DOM-ready block, but you are trying to access them from the event handler. if you can, remove the onclick from the element, and add it inside the DOM-ready block to share the variables.

$(document).ready(function(){

    // Store the selector
    var element = $('ul li.roundabout-in-focus')
    var wBack = element.height();
    var hBack = element.width();
    var lback = element.css('left');
    var tback = element.css('top');

   $("#someElement").click(function close_current(){
                    $('.nInfoIE').show();
                        $('.roundabout-in-focus').find('.img').show();
                        $('.roundabout-in-focus').css({position:'absolute',height:hBack,width:wBack,left:lBack,top:tBack});
                        $('.roundabout-in-focus').find('.iframe').css({'visibility':'hidden'});
                        $('ul li').find('.iframe').addClass('esconder');

                        $('ul li iframe').each(function(){
                            var tempurl = '';
                            tempurl = $(this).attr('src');
                            $(this).attr('src',tempurl.replace('?autoplay=1', ''));
                        });
                        watching = false;
                        $('.nInfoIE').hide();
   })
});

you should also cache the selector at the top of that block (as in my example) to keep from querying the DOM repeatedly (you could probably do this in the click handler as well, but the selectors are different so i left that function alone :)

hope that helps! cheers.

---

The variable it's only defined in the scope of the function you pass to the ready function. If you want to reference it, you need to declare it in the global scope. (Just remove the var keyword)

---

Your variables (wBack ,hBack,lback and tback) are just defined in your document.ready function. There are not global.

To be able to use it in your other function, your variable must be global. You can just remove the 'var' before your variable, because in javascript a variable declaration without the 'var' make the variable global. Or you can manually declare it global like this :

var wBack;      
var hBack;
var lback;
var tback;
$(document).ready(function(){
   wBack = $('ul li.roundabout-in-focus').height();
   hBack = $('ul li.roundabout-in-focus').width();
   lback = $('ul li.roundabout-in-focus').css('left');
   tback = $('ul li.roundabout-in-focus').css('top');
});