Bug Tracker

Opened 11 years ago

Closed 11 years ago

#3133 closed bug (invalid)

DOM insertion / selection BUG

Reported by: megavolt Owned by:
Priority: major Milestone: 1.3
Component: core Version: 1.2.6
Keywords: Cc:
Blocked by: Blocking:

Description

BUG: after inserting HTML snippet into the DOM structure button2 will not be selected via $(#button2):

demo.js:

$("#button1").click(function() { $.post("index.php", {action:"ajax", subact:"showchar"},

inserting button 2 that comes from the index.php into testdiv1

function(data){$("#testdiv1").html(data);)}, "text")

});

$("#button2").click(function(){ alert("test"); });

index.php:

echo '<input type="submit" id="button2" value="This should give an alert" /> ';

so by clicking the button2 there should be an alert-popup, but it doesn't appear!. To fix this situation I write <input type="submit" id="button2" onclick="alert('test')" />. So I think there is something wrong by insertion into the DOM structure or element selection.

Change History (3)

comment:1 Changed 11 years ago by megavolt

BUG: after inserting HTML snippet into the DOM structure button2 will not be selected via $(#button2):

demo.js: $(document).ready(function(){

$("#button1").click(function() { $.post("index.php", {action:"ajax", subact:"showchar"},

inserting button 2 that comes from the index.php into testdiv1

function(data){$("#testdiv1").html(data);)}, "text")

});

$("#button2").click(function(){ alert("test"); });

});

index.php:

echo '<input type="submit" id="button2" value="This should give an alert" /> ';

so by clicking the button2 there should be an alert-popup, but it doesn't appear!. To fix this situation I write <input type="submit" id="button2" onclick="alert('test')" />. So I think there is something wrong by insertion into the DOM structure or element selection.

comment:2 Changed 11 years ago by wojtekk

Try bind event after object will be created, example:

$(document).ready(
function(){
 $("#button1").click(
 function() {
  $.post("ticket-3133-test.php",
   {action:"ajax", subact:"showchar"},
   //inserting button 2 that comes from the index.php into testdiv1
   function(data){
    $("#testdiv1").html(data);
    $("#button2").click(function(){ alert("test"); }); // <- PROPOSED
    /*})*/ }, // <- ERROR?
    "text")
  });
 }
// $("#button2").click(function(){ alert("test"); }); // <- ERROR
); 

Demo: http://wojtekk.net/jQuery/ticket.php?id=3133

comment:3 Changed 11 years ago by dmethvin

Resolution: invalid
Status: newclosed

The event binding methods can only bind to elements that exist at the time of execution. If you need to bind to elements that do not yet exist, try the .live method in jQuery 1.3.

Note: See TracTickets for help on using tickets.