jQuery Event Methods Complete Reference

preventDefault() Event Method

Last Updated : 30 Sep, 2024

The preventDefault() method is used to prevent the browser from executing the default action of the selected element. It can prevent the user from processing the request by clicking the link.

Syntax:

event.preventDefault()

Parameters:

It does not accept any parameter. The event is used to denote the event or action by the user in the response to which the method works.

Example: This code will prevent the browser from going to another page.

html

<!DOCTYPE html>
<html lang="en">

<head>
    <title> preventDefault() Event Method </title>
    <!-- INCLUDE THE JQUERY CDN -->
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("a").click(function (event) {
                event.preventDefault();
                alert("prevented");
            });
        });
    </script>
</head>

<body>
    <p>Click the link:</p>
    <a href="https://www.google.com">GOOGLE</a>
</body>

</html>

Output:

Example: This code will prevent the browser from redirecting the page to another PHP file.

html

<!DOCTYPE html>
<html lang="en">

<head>
    <title> preventDefault() Event Method</title>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#submit").click(function (event) {
                event.preventDefault();
                alert("Action is prevented");
            });
        });
    </script>
</head>

<body>
    <form action="submit.php">
        <input type="text" placeholder="enter username">
        <input id="submit" type="submit" name="submit">
    </form>
</body>

</html>

Output:

jQuery Event Methods Complete Reference

_shreya_garg_

Improve

Article Tags :

Similar Reads

jQuery event.preventDefault() Method

The jQuery preventDefault() Method is used to stop the default action of the selected element to occur. It is also used to check whether preventDefault() method is called for the selected element or not. Syntax: event.preventDefault()Parameter: It does not accept any parameter. Example 1: This examp

jQuery event.result Property

The jQuery event.result is an inbuilt property which is used to find the last and previous value returned by an event handler started by the specified event. Syntax: event.result Parameter: It does not accept any parameter because it is a property not a function. Example 1: jQuery code to show the w

JavaScript Handler preventExtensions() Method

JavaScript handler.preventExtensions() method in JavaScript is a trap for Object.preventExtensions() method. New properties cannot be added to an object when extensions are disabled. It returns a boolean value. Syntax: const p = new Proxy(target, { preventExtensions: function(target) { } }); Paramet

jQuery event.isDefaultPrevented() Method

jQuery isDefaultPrevented() Method is an inbuilt method that checks whether the preventDefault() method was called for the event. This method returns a boolean value. It returns True if preventDefault() is called on the event, False otherwise.Â Syntax:event.isDefaultPrevented()Parameters: It accepts

jQuery Event Methods Complete Reference

An event refers to the actions performed by the site visitor during their interactivity with the website (or webpage). There can be various types of events such asThe user clicks on the button.The user moves the mouse pointer over an image.The user pressed any key from the keyboard, etc.Syntax:$(sel

jQuery event.stopPropagation() Method

The jQuery event.stopPropagation() method is an inbuilt method which is used to stop the windows propagation. In the DOM tree when setting an event with the child element and the parent element as well then if you hit on the child element event it will call both child and the parent element as well.

jQuery undelegate() Method

The jQuery undelegate() method is an inbuilt method that is used to remove the specified event handler from the selected element. Syntax: $(selector).undelegate(selector, event, function)Parameters: This method accepts three parameters as mentioned above and described below: selector: It is an optio

React onSubmit Event

The onSubmit event in React is an event handler that is triggered when a form is submitted. It allows you to handle form submissions and allows you to control what happens when a user submits a form, such as form validation, preventing the default submission behaviour, and executing custom logic lik

HTML DOM removeEventListener() Method

The removeEventListener() method is used to remove an event handler associated with the addEventListener() method. This method of removing event handler can be used only with the addEventListener() method specified using an external function. Syntax: element.removeEventListener(event, function, useC

jQuery event.stopImmediatePropagation() Method

The jQuery event.stopImmediatePropagation() is an inbuilt method in jQuery used to stop the rest of the event handlers from being executed for the selected element. Syntax: event.stopImmediatePropagation() Parameter: No parameter is required. Example 1: Here, only first pop box will appear after thi