How to prevent default on form submit?

by

The same way, actually!

// your function
var my_func = function(event) {
    alert("me and all my relatives are owned by China");
    event.preventDefault();
};

// your form
var form = document.getElementById("panda");

// attach event listener
form.addEventListener("submit", my_func, true);
<form id="panda" method="post">
    <input type="submit" value="The Panda says..."/>
</form>

Note: when using .addEventListener you should use submit not onsubmit.

Note 2: Because of the way you’re defining my_func, it’s important that you call addEventListener after you define the function. JavaScript uses hoisting so you need to be careful of order of things when using var to define functions.

Read more about addEventListener and the EventListener interface.

More Related Contents:

  1. Javascript unknown error
  2. What does “this” refer to in arrow functions in ES6?
  3. Origin null is not allowed by Access-Control-Allow-Origin
  4. How to debug JavaScript / jQuery event bindings with Firebug or similar tools?
  5. Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’
  6. What is the correct terminology for javascript promises
  7. How to use onClick() or onSelect() on option tag in a JSP page?
  8. Using http rest apis with angular 2
  9. Uncaught TypeError: Illegal invocation in JavaScript
  10. Converting any string into camel case
  11. How to split a long regular expression into multiple lines in JavaScript?
  12. Is localStorage.getItem(‘item’) better than localStorage.item or localStorage[‘item’]?
  13. Find the exact height and width of the viewport in a cross-browser way (no Prototype/jQuery)
  14. Encryption in JavaScript and decryption with PHP
  15. How to know when all Promises are Resolved in a dynamic “iterable” parameter?
  16. How do I print debug messages in the Google Chrome JavaScript Console?
  17. Date.getDay() javascript returns wrong day
  18. Socket.io Client: respond to all events with one handler?
  19. Redeclaring a javascript variable
  20. Toggle visibility property of div
  21. Can you get a public Facebook page’s feed using Graph API without asking a user to allow?
  22. Firebase – Get Random Child From Database Node
  23. Restricting eval() to a narrow scope
  24. Is it possible to add html inside a title attribute?
  25. jQuery Datepicker: Prevent closing picker when clicking a date
  26. Catch scrolling event on overflow:hidden element
  27. Show pop-ups the most elegant way
  28. Javascript Equivalent to C# LINQ Select
  29. How to assign a domain name to node.js server? [duplicate]
  30. javascript – find unique objects in array based on multiple properties

Leave a Comment