Jump to content
Larry Ullman's Book Forums
Sign in to follow this  
StephenM

Simple Question Brackets And Variable

Recommended Posts

Hi all,

 

I've been kept away from the computer lately with other jobs & it seems to take some time to get back into the swing of things again. Also, I haven't studied javascript or jquery properly yet as I want to finish the PHP/MySQL book first (on chapter 11) so please forgive me for what is probably a simple question as follows:

 

I would like to add a little jquery functionality and I'm having a syntax error probably something to do with the '' or "" symbols.

 

So the script works fine as follows:

<script>

    $(document).ready(
        function(){
            $('#table1').hide();
            $('#button1').click(function(){
                $('#table1').toggle();
            });
        });    
$(document).ready(
        function(){
            $('#table2').hide();
            $('#button2').click(function(){
                $('#table2').toggle();
            });
        });    
$(document).ready(
        function(){
            $('#table3').hide();
            $('#button3').click(function(){
                $('#table3').toggle();
            });
        });    
$(document).ready(
        function(){
            $('#table4').hide();
            $('#button4').click(function(){
                $('#table4').toggle();
            });
        });    
$(document).ready(
        function(){
            $('#table5').hide();
            $('#button5').click(function(){
                $('#table5').toggle();
            });
        });

</script>

but I can't seem to get it to work as follows:

(I reckon it is to do with the +i being outside the ''?

<script>
$(document).ready(
        function(){
            var i =1;
            for (i = 1; i <= 5; i++){
                $('#table'+i).hide();
                $('#button'+i).click(function(){
                    $('#table'+i).toggle();
                });
                console.log('#table'+i);
                console.log('#button'+i);
            }
        });
</script>

Share this post


Link to post
Share on other sites

This is not a syntax issue. It's a closure issue.

If you're new to JS, this is a pretty advanced topic to cover, so I'm going to start by referring you to the following:

http://stackoverflow.com/questions/111102/how-do-javascript-closures-work

 

If you still can't understand what's wrong with your code and how you need to fix it, then please come back here and let us know, and I'll try to better explain things.

Thanks.

  • Upvote 1

Share this post


Link to post
Share on other sites

This is not a syntax issue. It's a closure issue.

If you're new to JS, this is a pretty advanced topic to cover, so I'm going to start by referring you to the following:

http://stackoverflow.com/questions/111102/how-do-javascript-closures-work

 

 

Hi Hartley,

Thanks for the answer, that's fine. I prefer not to go into depth on something in a half-hazard manner.

I prefer the systematic approach to learning.

I thought the issue was something simple I was missing.

In that case, I think I am going to wait until I get to "Modern Javascript" and cover it in a more methodical manner.

Is this issue dealt with in the book do you know?

 

I'm going to put this into my tasks and post back the solution in a few months when I get to it.

Thanks again,

Stephen

Share this post


Link to post
Share on other sites

Closure is mentioned in the book, but in all honesty, I wish that Larry would have gone more in-depth with it with more examples. It's a very important concept to understand, and it's tricky until you get it down.

All the same, he does mention it, and his little blurb about it might be enough for you to get it. If it's not, please come back and ask about it, and I'll try to explain it.

Thanks.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...