I have a simple question. My JS code is like this, but when I try to add a new element or content to the <div>, it comes up then goes up quickly. I don't know why.
How can I avoid this?
<head> $(document).ready(function () { $('#mybtn').click(function () { $('#main').append('<button id ="mm" onclick="myfun()">generate code my fun.</button>'); }); }); </head> <body> <form id="form1" runat="server"> <button id ="mybtn">generate code</button> <div id="main"></div> </form> </body> You should stop the button from Submitting the form by setting the button's type to be that of button.
Example :
<button type="button" id="mybtn">generate code</button> The default type for a <button> element is submit. Which is causing your <FORM> tag to submit.
Try this:
$('#mybtn').click(function (e) { e.preventDefault(); $('#main').append('<button id ="mm" onclick="myfun()"> generate code my fun </button>'); return false; }); 
Try with:
$('#mybtn').click(function (event) { event.preventDefault(); $('#main').append('<button id ="mm" onclick="myfun()"> generate code my fun </button>'); }); preventDefault : If this method is called, the default action of the event will not be triggered.
type, example :<button type="button" id="mybtn">generate code</button>. This will stop the button from Submitting.<form>tag? (If its .ASPX then I guess it would be.) If so then try my suggestion of setting thetypeof the button.