Just to elaborate (because it tripped me up when I start out too and
other js noobs like me might find it useful):

In your example, function "force" is a function within the
document.ready function:

$(document).ready(
    function(){    // Function called when document.ready fires
        function force(){  // Function belonging to document.ready
event
        doStuffHere...}
    }
);

Remember that variables declared within functions only exist for that
function. If you ran the code below, the message box would return
undefined:

<script>
function someFunction() {
    var someVar = "hi";
}

someFunction();
alert(someVar);
</script>

The key is to remember that document.ready calls a function - it isn't
just free javascript that executes in-line like the alert call above.

What you can do to make the funciton global, is to declare the
variable outside of the function, and assign it later.

For example, for a variable we can modify the earlier script:

<script>
var someVar;
function someFunction() {
    someVar = "hi";
}

someFunction();
alert(someVar);
</script>

This will return "hi" because the 'someVar' function is scoped outside
of the function someFunction.

In the same way, you can modify your script to the following, and it
shoud work:

<script type="text/javascript">
var force;
$(document).ready(function(){
        force = function(){
        doStuffHere...}

        $('#joda').click(function () {
        $('img').show();
        setInterval('force()',500);
        });
});
</script>

Now the variable 'force' is global, the function will stick after
document.ready has completed and your code should work.

Hope this helps everyone out with other scoping issues :D

On Jan 16, 9:56 am, Hamish Campbell <[EMAIL PROTECTED]> wrote:
> The function 'force' belongs to the document.ready call, so as soon as
> that's done 'force' is destroyed.
>
> If you put it outside of the document.ready, the function exists
> globally for all javascript in the page.
>
> On Jan 16, 9:13 am, tlob <[EMAIL PROTECTED]> wrote:
>
>
>
> > hm... why? can you explain me in detail why its not working that way?
> > I like to learn.
>
> > I uploaded it:http://www.lightwavers.net/dadda/
>
> > click joda, the icons should appear and start whirling around like
> > this:http://www.ontoinfo.com/2006/09/22/javascript-flying-pictures-effect/
>
> > thx
> > tl
>
> > On Jan 15, 7:52 pm, Feijó <[EMAIL PROTECTED]> wrote:
>
> > > try with force function outside $...ready
>
> > > Feijó
>
> > > ----- Original Message -----
> > > From: "tlob" <[EMAIL PROTECTED]>
> > > To: "jQuery (English)" <jquery-en@googlegroups.com>
> > > Sent: Tuesday, January 15, 2008 4:11 PM
> > > Subject: [jQuery] simple newbie js function problem...
>
> > > > script type="text/javascript">
>
> > > > $(document).ready(function(){
>
> > > > function force(){
> > > > doStuffHere...}
>
> > > > $('#joda').click(function () {
> > > > $('img').show();
> > > > setInterval('force()',500);
> > > > });
>
> > > > });
> > > > </script>
>
> > > > if I click #joda I got the Error: force is not defined.
>
> > > > hmmm.
> > > > I have some basic misunderstanding here...
>
> > > > THX in advance!
>
> > > > cheers
> > > > tlz- Hide quoted text -
>
> > - Show quoted text -- Hide quoted text -
>
> - Show quoted text -

Reply via email to