Jquery 1.9.1 - Variable Undefined Error

Question

I am trying to get the offset value of a class in a variable. When I print the value of the variable like directly it shows the value. But when I add .top to that varialble it shows that the variable is undefined.

Heres the example

var elementHeight = $(".rickshaw_graph .detail .item");
   var offset = elementHeight.offset();
   console.log(offset)

When I check the console it shows

({top:735.9499969482422, left:402.70001220703125})

But when I add top to the above code

var elementHeight = $(".rickshaw_graph .detail .item");
       var offset = elementHeight.offset();
       console.log(offset.top)

It shows that the offset variable is undefined. What should I do here?

just question on the side, why do you do var offset = offset = ? — Alex, Jun 13 '13 at 07:33
@Alex Probably one is local and the other is global variable. — Tauri28, Jun 13 '13 at 07:34
*"It shows that the offset variable is undefined."* That means that there is no element that matches `.rickshaw_graph .detail .item`. If there is, it works: http://jsfiddle.net/WVDTX/1/. No idea why the first example works though. — Felix Kling, Jun 13 '13 at 07:34
@Alex @tauri Sorry Edited the code Properly now. Ruben`s answer is working, but I want to store the offset value inside a variable. — Ash, Jun 13 '13 at 07:37
As I said, no idea why the first example works. Maybe you have another `console.log` somewhere? But as you can see from my demo, accessing `object.top` obviously works. — Felix Kling, Jun 13 '13 at 07:42
Definitely no. I`ve checked it. Don`t know whats the issue.. — Ash, Jun 13 '13 at 07:44
Could you create a http://jsfiddle.net/ demo which demonstrates the problem? — Felix Kling, Jun 13 '13 at 07:46

Ruben Nagoga · Answer 1 · 2013-06-13T07:58:08.737

1

Try

var elementHeight = $(".rickshaw_graph .detail .item");
       var offset = elementHeight.offset();
       setTimeout(function() { console.log(offset.top) }, 0);

edited Jun 13 '13 at 07:58

answered Jun 13 '13 at 07:30

Ruben Nagoga

2,178
1
19
30

Amazing!! Works like charm. Thank you ruben. But can u pls explain why should I do this here? – Ash Jun 13 '13 at 07:32
Also what to do If I have to store the same value in a variable? – Ash Jun 13 '13 at 07:33
As I understand elementHeight.offset() works synchronously in first example because you are trying access exactly variable which is waiting for response. In second situation you accessing to attribute of object which is not defined. If you want to save it to variable declare it before setTimeout and difine in setTimeout callback function. – Ruben Nagoga Jun 13 '13 at 07:48
I declared like this.. var elementHeight = $(".rickshaw_graph .detail .item"); var offset = elementHeight.offset(); var off; setTimeout(function() { off= offset.top }, 0); console.log(off) It shows undefined. – Ash Jun 13 '13 at 07:58
And probably you get again undefined? Put `console.log` into `setTimeout` – Ruben Nagoga Jun 13 '13 at 07:58
You still haven't explained why `setTimeout` works. If an object is contained in a variable, surely I can access its property directly, or not? – Felix Kling Jun 13 '13 at 08:00
@Ash: That's because `setTimeout` executes the callback after `console.log(off)` is called. – Felix Kling Jun 13 '13 at 08:00
That will work.. but I want to use the variable outside the function.. I need to implement a condition for hover – Ash Jun 13 '13 at 08:03
@Ash: I still think the problem is through something else. This solution would just be a workaround. If you can recreate the problem with a http://jsfiddle.net/ demo, then we might be able to find a proper solution. – Felix Kling Jun 13 '13 at 08:06
I used like this.. var off=setTimeout(function() { off= offset.top }, 0);... it`s working now.. hope I can write a condition with it.. – Ash Jun 13 '13 at 08:06
@Ash: It just *looks* like it works. The code does not do what you think it does. `setTimeout` returns an integer which is the ID of the timeout so that you can cancel it later if you want to. It is not the position of the element. Here is a simple counter-example: http://jsfiddle.net/txSFk/. – Felix Kling Jun 13 '13 at 08:08
@Felix Don`t know Felix, But current solution seem to be working.. will check.. if not, I will do... – Ash Jun 13 '13 at 08:09
Checked you example felix.. To make my question more clear I am not using the class in the HTML.. like
– Ash Jun 13 '13 at 08:20
About setTimeout 0 you can read in this [question](http://stackoverflow.com/questions/779379/why-is-settimeoutfn-0-sometimes-useful) – Ruben Nagoga Jun 13 '13 at 08:20
But You`re absolutely right felix, settime just not working as I want.. Hope u seen my last comment and reply if that gives u any idea – Ash Jun 13 '13 at 08:24
@Ash: If you want to notify me, you have to write `@Felix` ;) Anyways, the only way to really help you would be if you create a jsfiddle demo. The JavaScript code is only one side of the coin. We also have to know about the HTML or the elements to get a complete picture. – Felix Kling Jun 13 '13 at 10:23

Jquery 1.9.1 - Variable Undefined Error

1 Answers1