Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Nov 2009
    Posts
    62
    Thanks
    9
    Thanked 0 Times in 0 Posts

    jquery functions

    I wrote a script what didn't work fine,so i deleted everything except the basics:
    PHP Code:
    $(document).ready(function(){
                    var 
    num 8;
                            var 
    text "";
                            var 
    1;
                            for(var 
    1;<=2;a++)
                                    {
                                    for(var 
    1;<=num;i++)
                                            {
                                            
    text += "<div class = 'keret'><img src = 'docs/" ".png' class = 'kep' alt = '" "'></div>";
                                            
    r++;
                                            }
                                    }
            $(
    "#pic_box").html(text);
            
            $(
    ".kep").click(function(){                          //first function
                    
    $(this).removeClass().addClass("selected");
            
            });
            $(
    ".selected").click(function(){               //second function
                    
    alert("sys");
            });     
    }); 
    Shortly,i fill up the pic_box with pictures,if i click on a picture i give it the class: "selected".
    But if i click on a picture with the class "selected",nothing happens.
    If i take the 2. function inside the 1. function,it works,the alert pops up.
    I don't understand why the second func can't work outside the first,is there some inheritance,or what?

  • #2
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    This happens because jQuery doesn't realize the element has now been assigned the class "selected". Your selector doesn't see the element as having that class because you dynamically assigned it after all the selectors got processed upon page load.

    It's an easy fix; instead of using the .click(function() {}) function, use the .live('click', function() {}) function.

    http://api.jquery.com/live/

  • The Following 2 Users Say Thank You to Fumigator For This Useful Post:

    attasz (03-28-2010), Ralph Shnelvar (04-04-2010)

  • #3
    New Coder
    Join Date
    Nov 2009
    Posts
    62
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Thx man,it's a really understandable explanation with a really simple and good solution.Have a nice day!

  • #4
    New to the CF scene
    Join Date
    Apr 2010
    Posts
    9
    Thanks
    4
    Thanked 0 Times in 0 Posts
    I agree with attasz.

    Sometimes the most helpful solutions are the shortest.

    Having said that, could Fumigator point to some online documentation that fleshes out his answer? Specifically, is there a document somewhere that backs up Fumigator's answer?

  • #5
    UE Antagonizer Fumigator's Avatar
    Join Date
    Dec 2005
    Location
    Utah, USA, Northwestern hemisphere, Earth, Solar System, Milky Way Galaxy, Alpha Quadrant
    Posts
    7,691
    Thanks
    42
    Thanked 637 Times in 625 Posts
    Quote Originally Posted by Ralph Shnelvar View Post
    I agree with attasz.

    Sometimes the most helpful solutions are the shortest.

    Having said that, could Fumigator point to some online documentation that fleshes out his answer? Specifically, is there a document somewhere that backs up Fumigator's answer?
    In my first post I linked to jQuery's online documentation where the purpose of live() is explained in detail.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •