javascript - .toggle() sometimes taking double click before working -
i have simple application, i'd toggle between showing , hiding elements in fieldset using jquery's .toggle effect. problem is, have double-click button enables toggle, work.
any ideas on what's going on?
html:
<!doctype html> <html> <head> <script src="jquery-2.1.1.min.js"></script> <script src="test.js"></script> </head> <body> <div class="leftframe"> <div id="lefttable"><strong>left</div> </div> <div id="maintable"><strong>main <div> <br> <form><fieldset><legend><button id="buttonshowfields">add info</button></legend> <div id="infoaddfields"> id: <input type="text"><br> serial number: <input type="text"><br> location: <select id="inputlocation"> <option>location1</option> <option>location2</option></select><br> status: <select id="inputstatus"> <option>complete</option> <option>in process</option></select><br> </div> </fieldset></form> </div> </div> </body> </html> ... , javascript (test.js ref in html above):
$(document).ready(function(){ // show options add together workorder // $("#woaddfields").hide(); $("#buttonshowfields").click(function(){ $("#infoaddfields").toggle(); }); });
prevent submit event.preventdefault() when click button
http://jsfiddle.net/3nppp/
$(document).ready(function(){ $("#buttonshowfields").click(function(e){ e.preventdefault(); $("#infoaddfields").toggle(); }); }); javascript jquery html
No comments:
Post a Comment