jQuery AJAX: Cómo anexar un mensaje de “salvación” y que la hace desaparecer después de un segundo

StackOverflow https://stackoverflow.com/questions/1283557

  •  16-09-2019
  •  | 
  •  

Pregunta

Este es probablemente muy simple para un experto en jQuery.

Tengo

Quiero un mensaje guardado aparecen y desaparecen. Pero yo no quiero hacer la forma de sus elementos o desaparecer.

Tengo una llamada AJAX que es como la siguiente.

function saveCaption(id) {

var queryString = $('#form'+id).formSerialize(); 

  $.ajax({

    type: "POST",

    url: "includes/ajax.php?request=saveCaption",

    data: queryString,

    success: function(response) {

      $('#form'+id).append(response)

    }

  });

  return false;

}

Me preguntaba .. Puedo añadir la respuesta. Pero hay una manera a desvanecerse a cabo de inmediato después de un segundo. En este momento, sólo se sigue repitiendo y añadiendo a la última anexión. Me gustaría que aparecen y desaparecen inmediatamente después de usar fadeOut.

ACTUALIZACIÓN: Lo hice basado en la respuesta theIV y de RaYell. Funciona .. pero es elegante?

función saveCaption (id) {

var queryString = $('#form'+id).formSerialize(); 

  $.ajax({

    type: "POST",

    url: "includes/ajax.php?request=saveCaption",

    data: queryString,

    success: function(response) {

        $('#form'+id).append('<div id="message">'+response+'</div>');

        setTimeout(function () {

          $('#message').fadeOut(function(){

            $(this).remove();

          });

        }, 1000);

    }

  });

  return false;

}

¿Fue útil?

Solución

Creo que querrá hacer una combinación de la respuesta de RaYell anterior, pero utilizar un quite en la devolución de llamada fadeOut, o de lo contrario seguirá añadiendo a las órdenes de agregar-a anterior menos, creo que va a hacer que en base a la forma en que expresó su pregunta. Algo como esto podría funcionar:

setTimeout(function () {
  $('selector').fadeOut(function(){
    $(this).remove();
  });
}, 1000);

Otros consejos

Después de anexar el mensaje añadir este (dentro de devolución de llamada de éxito):

setTimeout(function () {
    $('selector').fadeOut();
}, 1000);

Reemplazar selector con algo que realmente va a coincidir con su mensaje.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top