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
    Regular Coder
    Join Date
    Jun 2005
    Posts
    153
    Thanks
    26
    Thanked 0 Times in 0 Posts

    jQuery work with changed div

    Hello everyone,

    Using:
    FF: 3.5
    jQuery: latest

    Is there a way to make jQuery use code that has been injected into a <div> element.

    This code works:
    Code:
    ....all the including of Jquery etc goes here...
    
    $("#test").click(function()
    {
    	alert("Hey this Works!");
    });
    
    ...ending scripts and going to body etc.....
    <div id=results><input type=button id=test></div>
    This code will not work:
    PHP Code:
    //PHP Code called under specific getjson
    $html .= "<input type=button id=test>";
    return 
    $html
    Code:
    ....all the including of Jquery etc goes here...
    $.getJSON(url, function(data)
    {
    	$("#results").html(data); //this does successfully add input button
    });
    $("#test").click(function()
    {
    	alert("Why won't this work!");
    });
    ...ending scripts and going to body etc.....
    <div id=results></div>
    This code successfully adds <input id=test> into <div id=results> but it will not execute because it has been added later. Is there a way to make this work with getJson?

    Thanks,

    questionable
    Last edited by questionable; 12-21-2009 at 10:18 PM.

  • #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
    With the latest jQuery version there is a function called live() which you can use for this very purpose. Here's a similar thread on the subject:

    jquery toggle/hide problem

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

    questionable (12-23-2009), tomws (12-21-2009)

  • #3
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    I've had this happen. I think the workaround is to put the new click handler inside the json function so that the event is attached after the appropriate element is inserted.
    Code:
    $.getJSON(url, function(data)
    {
    	$("#results").html(data); //this does successfully add input button
    	$("#test").click(function()
    	{
    		alert("Why won't this work!");
    	});
    });
    There's probably a better way to do it, but I think that's how I got mine to work.
    Are you a Help Vampire?

  • #4
    Senior Coder tomws's Avatar
    Join Date
    Nov 2007
    Location
    Arkansas
    Posts
    2,644
    Thanks
    29
    Thanked 330 Times in 326 Posts
    Quote Originally Posted by Fumigator View Post
    With the latest jQuery version there is a function called live() which you can use for this very purpose.
    And there's the better way!
    Are you a Help Vampire?

  • #5
    Regular Coder
    Join Date
    Jun 2005
    Posts
    153
    Thanks
    26
    Thanked 0 Times in 0 Posts

    Works Great!

    Works Great!


  •  

    Posting Permissions

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