Prevent a link to reload page

by

It’s not the element that need a .preventDefault(), its the click event.

Try this:

$('nav.menu a').click(function (event) {
  event.preventDefault();
  // or use return false;
});

I don’t recommend to use the href as selector though, better to give it an id or name.

From MDN, about .preventDefault():
Cancels the event if it is cancelable, without stopping further propagation of the event.

You can read more here:

There is a CSS way, using pointer-events.

So by using in the CSS pointer-events: none; all click will be ignored. This is a “recent” alternative and suported in IE11+, Firefox 3.6+, Chrome 2.0+, Safari 4+.

Example

More Related Contents:

  1. How to wait until an element exists?
  2. jQuery load more data on scroll
  3. Can I call jQuery’s click() to follow an link if I haven’t bound an event handler to it with bind or click already?
  4. Include jQuery in the JavaScript Console
  5. How to generate a simple popup using jQuery
  6. Expose jQuery to real Window object with Webpack
  7. jQGrid, how to make a column editable in the add dialog but not during (inline) edits
  8. How to display JavaScript variables in a HTML page without document.write
  9. How can I control the back button event in jQuery Mobile?
  10. What’s the purpose of starting semi colon at beginning of JavaScript? [duplicate]
  11. How to detect if javascript files are loaded?
  12. TypeError: $(…).DataTable is not a function
  13. JavaScript REST client Library [closed]
  14. Text blinking jQuery
  15. Stop page execution like the alert() function
  16. Remove plus sign (+) in URL query string
  17. Mozilla firefox not working with window.onbeforeunload
  18. Why does multiple modal using twitter bootstrap got error too much recursion?
  19. Disabling right click on images using jquery
  20. Javascript: extract URLs from string (inc. querystring) and return array
  21. JQuery – animate moving DOM element to new parent?
  22. Large dynamically sized html table with a fixed scroll row and fixed scroll column
  23. jQuery question: what does it really mean?
  24. Regex for allowing alphanumeric,-,_ and space
  25. Twitter bootstrap progress bar animation on page load
  26. How to call parent window function from child window jquery?
  27. How to add Rowspan in JQuery datatables
  28. JQuery AutoComplete, manually select first searched item and bind click [duplicate]
  29. What does this JavaScript/jQuery syntax mean?
  30. Google maps responsive resize

Leave a Comment