jQuery ajaxSuccess() Method

Last Updated : 12 Jul, 2023

The ajaxSuccess() method in jQuery is used to specify the function to be run when an AJAX request completed successfully.

Syntax:

$(document).ajaxSuccess(function(event, xhr, options))

Parameters:: This method accepts a single parameter function which is mandatory. This function accepts three parameters as mentioned above and described below:

  • event: It holds the event object.
  • xhr: It holds the XMLHttpRequest object.
  • options: It holds the used options in AJAX request.

The demo.txt file stored on server and it will load after clicking the change content button.

demo.txt

This is GFG.

Example 1: This example changes the content of

element, by taking the data from server. When the AJAX request is completed successfully, the page says AJAX request successfully completed..

html

<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    script>

    
    <script>
        $(document).ready(function () {
            $(document).ajaxSuccess(function () {
                alert("AJAX request successfully completed.");
            });

            $("button").click(function () {
                $("#paragraph").load("demo.txt");
            });
        });
    script>
head>

<body style="text-align:center;">

    <div id="div_content">

        <h1 style="color: green;">
            GeeksforGeeks
        h1>

        <p id="paragraph" style="font-size: 20px;">
            A computer science portal for geeks
        p>
    div>

    <button>
        Change Content
    button>
body>

html>

Output:

jQuery-92

Example 2: This example changes the content of

element, by taking the data from server. When the AJAX request is completed successfully, the page says AJAX request successfully completed.

html

<html>

<head>
    <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
    script>

    
    <script>
        $(document).ready(function () {
            $(document).ajaxSuccess(function () {
                alert("AJAX request successfully completed.");
            });

            $("button").click(function () {
                $("#heading").load("demo.txt");
            });
        });
    script>
head>

<body style="text-align:center;">

    <div id="div_content">

        <h1 id="heading" style="color: green;">
            GeeksforGeeks
        h1>

        <p style="font-size: 20px;">
            A computer science portal for geeks
        p>
    div>
    <button>Change Contentbutton>
body>

html>

Output:

jQuery-93

Comment

Explore