jQuery values set in $(document).ready() function

Question

I want to set values for objects after the DOM has loaded completely. Problem is, I'm getting a null pointer exception after calling a `OnBlur` and `OnFocus` event from a textbox. What am I doing wrong? javascript: ``` $(document).ready(function () { var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last() }); var tempThursdayHrs = 0.0; function BlurThursdayHrs(sender, args) { sumThursdayHrs.text(tempThursdayHrs + sender.get_value()); } function FocusThursdayHrs(sender, args) { tempThursdayHrs = sumThursdayHrs.text() - sender.get_value(); } ``` markup: ``` ``` error: Microsoft JScript runtime error: 'sumThursdayHrs' is undefined

Accepted Answer

As you said in the heading, the values are set in a function (the ready-event-handler function). But JavaScript has function scope, and as you declared `sumThursdayHrs` to be a local (not to say "private") variable by using the `var` keyword, it is undefined from outside. Two possibilites:

- Make sumThursdayHrs a global variable (remove "var") (and eventually declare it outside). Note that global variables should be avoided where possible to preclude naming conflicts and co

- or take all functions using it into the same scope. Watch out, then these function will also be no more globally available so you need to set the blur/focus handlers in the same context (as Patrick Scott suggested).

jQuery values set in $(document).ready() function

Solution

Problem