javascript - jquery.on("click") doens't work as i expected -
this question has answer here:
i building web app. main navigation of web app refreshed jquery after refresh jquery event doesnt work.
the "on button" has jquery event bound .on , everytime clicked append paragraph. "reset button" adds "on button" jquery event doesn't apply it.
i have used .on method circumvent second "on button" isn't in dom when document ready.
here simple example:
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <title>blub</title> <script src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(".reset").click(function() { $("nav").append('<button class="on">test</button>'); }) var count = 0; $(".on").on("click", function(){ $(".cont").append("<p>another paragraph! "+(++count)+"</p>"); }); }); </script> </head> <body> <button class="reset">reset</button> <nav> <button class="on">test</button> </nav> <div class="cont"></div> <script> </script> </body> </html>
.on isn't direct replacement .live, syntax different. if want affect elements added dom later, need use this:
$(document).on('click', '.on', function(){ }); 
Comments
Post a Comment