w3resource

jQuery: Cancel the default action (click)

jQuery Events : Exercise-11 with Solution

Cancel the default action (click) of the first URL.

Sample Data :

<div style="background-color:yellow">
 <p>Click the button to change the background color of this paragraph.</p>
 <button>Click me!</button>
 </div>

Solution:

HTML Code:


<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
  <meta charset="utf-8">
  <title>Cancel the default action (click) of the first URL</title>
</head>
<body>
<a id="mysql" href="https://www.w3resource.com/mysql/mysql-tutorials.php">MySQL Tutorial</a>
  <p></p>  
<a id="sqlite" href="https://www.w3resource.com/sqlite/">SQLite Tutorial</a>  
</body>
</html>

JavaScript Code :


$('#mysql').click(function(e) {
  event.preventDefault();
 });

Live Demo:

See the Pen jquery-events-exercise-11 by w3resource (@w3resource) on CodePen.


Contribute your code and comments through Disqus.

Previous: Stop people from writing in first text input box (user ID).
Next: Return previous values of custom events.

What is the difficulty level of this exercise?

Test your Programming skills with w3resource's quiz.



Follow us on Facebook and Twitter for latest update.