Event Delegation -- JQuery Skips Click -


I'm adding content [button & amp; The table uses the 'my' container 'load method.

However, the dynamic content requires a delegation and I believe that my code is wrong for this and I am misleading parents / children. When I load my page, my 'table' loads, even without button1 click on $ ("#Contentbox"). ("Click", '# table .button2', load question);}); Function loadUserNameTable () {$ ("#Content Holder"). Load ("nametable.html"); } Function load question () {$ ("# content owner"). Load ("questions.html"); } Function loadPasswordChanger () {$ ("#Content Holder"). Load ("passwordchange.html"); } & Lt; / Script & gt; & Lt; Div id = "content owner" & gt; & Lt; Button Type = "Button" ID = "Button 1" & gt; Reset Start Password & lt; / Button & gt; & Lt; / Div & gt; //nametable.html & lt; Div class = "table" & gt; & Lt; Table id = "table1" style = "margin: 0 auto" & gt; & Lt; TR & gt; & Lt; TD & gt; Enter username: & lt; / Td> & Lt; TD & gt; & Lt; Input type = "text" id = "user name" value = "" /> & Lt; / TD & gt; & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; & Lt; / TD & gt; & Lt; TD & gt; & Lt; Button id = "button2" style = "float: left" & gt; & Lt; / Button & gt; Submit & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt; & Lt; / Div & gt; //questions.html & lt; Div class = "qs" id = "questions" style = "margin: 0 auto" & gt; & Lt; Table style = "margin: 0 auto" & gt; & Lt; TR & gt; & Lt; Td> Question 1: & lt; / Td> & Lt; Td> & Lt; Input type = "text" / & gt; & Lt; / Td> & Lt; / TR & gt; & Lt; TR & gt; & Lt; Td> Question 2: & lt; / Td> & Lt; Td> & Lt; Input type = "text" / & gt; & Lt; / Td> & Lt; / TR & gt; & Lt; TR & gt; & Lt; TD & gt; & Lt; / TD & gt; & Lt; TD & gt; & Lt; Button id = "button2" style = "float: left" & gt; & Lt; / Button & gt; Submit & lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt; & Lt; / Div & gt;

Your problem is due to the fact that is most likely That before any event happens you are performing your functions. Change your code at:

  $ (document) .ready (function () {$ ("# button1"). Click (loadUserNameTable); $ ("# contentbox"). "Click", '#table .button2', loadUserNameTable);});  

This is due to the fact that you were using the brackets () after your function, which executes Do it immediately (and not an event) If you've just put the name of your function without brackets, then once the event is created, jQuery will be careful to execute it.


Comments

Popular posts from this blog

python - Overriding the save method in Django ModelForm -

html - CSS autoheight, but fit content to height of div -

qt - How to prevent QAudioInput from automatically boosting the master volume to 100%? -