jQuery | Método ajaxSuccess()

El método ajaxSuccess() en jQuery se usa para especificar la función que se ejecutará cuando una solicitud AJAX se complete con éxito.

Sintaxis:

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

Parámetros: Este método acepta la función de parámetro único que es obligatoria. Esta función acepta tres parámetros, como se mencionó anteriormente y se describe a continuación:

  • evento: contiene el objeto de evento.
  • xhr: Contiene el objeto XMLHttpRequest.
  • opciones: contiene las opciones utilizadas en la solicitud de AJAX.

El archivo demo.txt se almacena en el servidor y se cargará después de hacer clic en el botón Cambiar contenido .
demostración.txt

This is GFG.

Ejemplo 1: este ejemplo cambia el contenido del elemento <p> tomando los datos del servidor. Cuando la solicitud de AJAX se completa con éxito, la página dice Solicitud de AJAX completada con éxito. .

<!DOCTYPE html> 
<html> 
    <head> 
        <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
        </script> 
          
        <!-- Script to use ajaxSuccess() method -->
        <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>                    

Producción:

  • Antes de hacer clic en el botón:
  • Después de hacer clic en el botón:

Ejemplo 2: este ejemplo cambia el contenido del elemento <h1> tomando los datos del servidor. Cuando la solicitud de AJAX se completa con éxito, la página dice Solicitud de AJAX completada con éxito. .

<!DOCTYPE html> 
<html> 
    <head> 
        <script src=
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> 
        </script> 
          
        <!-- Script to use ajaxSuccess() method -->
        <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 Content</button> 
    </body> 
</html>                    

Producción:

  • Antes de hacer clic en el botón
  • Después de hacer clic en el botón

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *