jquery submit event not working properly

Question

hello I try to grab the submit event, and then I try to pop an alert that says "werks" so I know it works. Note that I have double-checked that the jquery.js file is present in the same folder, and it is the newest jquery.min.js from the jquery website.

When I submit the form, it automatically goes into "get" mode and displays this URL in the URL bar in my browser: "http://localhost/test.html?input=" instead of showing me the alert. I think jquery is trolling me. Full code below:

<!DOCTYPE html> <html> <head> <title>test</title> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $('#form').submit(function(event){ event.preventDefault(); alert('werks'); });</script> </head> <body> <form id="form"> <input type="text" name="input"> <input type="submit" value="Send"> </form> </body> </html>

enclose your code in $(function(){ ... jquery code ... });

Arno 2501
– Arno 2501

2013-10-18 07:56:20 +00:00
Commented Oct 18, 2013 at 7:56 — Arno 2501
– Arno 2501, Commented Oct 18, 2013 at 7:56

Udan · Accepted Answer · 2013-10-18 07:58:40Z

Try the following code:

<!DOCTYPE html> <html> <head> <title>test</title> <script type="text/javascript" src="jquery.js"></script> </head> <body> <form id="form"> <input type="text" name="input"> <input type="submit" value="Send"> </form> </body> <script type="text/javascript"> $( document ).ready(function() { $('#form').submit(function(event){ event.preventDefault(); alert('werks'); }); }); </script> </html>

Klaster_1 Нет войне · Accepted Answer · 2013-10-18 07:58:32Z

$('#form') selector returns nothing, since the markup form isn't loaded yet. Move script block after form, or wrap it in $(document).ready(function () { ... }).

w3bMak3r · Accepted Answer · 2013-10-18 07:57:45Z

You need to put it in a document ready statement:

$( document ).ready(function(){ //Code Here });

Arno 2501 · Accepted Answer · 2013-10-18 07:58:01Z

<script type="text/javascript"> $(function(){ $('#form').submit(function(event){ event.preventDefault(); alert('werks'); }); </script>

Bas Wildeboer · Accepted Answer · 2013-10-18 07:58:26Z

fire your js code on document ready like this:

$(function() { $('#form').submit(function(event){ event.preventDefault(); alert('werks'); }); });

Collectives™ on Stack Overflow

jquery submit event not working properly

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Comments

Comments

Comments

Comments

Comments

Related