0

Tenho o seguinte código:

if(oper == 1) {
  $("#op" + iddoc).html("<input type='button' onClick='AddExcDocCPS(\"" + idcontrato + "\", \"" + iddoc + "\", 0)' value='Excluir' class='BT_Vermelho'>");
  //alert("Documento Incluído com Sucesso!");
  $(".MsgRetorno").html("<P style='margin:0; color:green;'>Documento Incluído com Sucesso!</P>");
  $(".MsgRetorno").fadeOut(1000);
}
else
{
  $("#op" + iddoc).html("<input type='button' onClick='AddExcDocCPS(\"" + idcontrato + "\", \"" + iddoc + "\", 1)'  value='Incluir' class='BT_Verde'>");
  //alert("Documento Excluído com Sucesso!");
  $(".MsgRetorno").html("<P style='margin:0; color:red;'>Documento Excluído com Sucesso!</P>");
  $(".MsgRetorno").fadeOut(1000);
}

É uma lista com botão excluir que vira incluir e vice-versa. Acontece que ele só aparece o uma vez... Após o fadeOut() ela nao aparece novamente quando clico nos botões. Sou iniciante em JQuery.

Alguém sabe me dizer o por que?

1 Resposta 1

1

Utilize o callback do método fadeOut. Quando você faz o fadeOut, a div fica permanentemente oculta. É preciso esvaziá-la e restaurá-la antes de fazer um novo fadeOut.

Exemplo baseado no seu código:

idcontrato = iddoc = 1;
oper = 1;
function AddExcDocCPS(){

    // cancela se algum fade estiver ocorrendo
   $(".MsgRetorno")
   .stop(true, true)
   .html("")
   .show();

   
   if(oper == 1) {
      idcontrato = iddoc = 1;
      oper = 2;
     $("#op" + iddoc).html("<input type='button' onClick='AddExcDocCPS(\"" + idcontrato + "\", \"" + iddoc + "\", 0)' value='Excluir' class='BT_Vermelho'>");
     //alert("Documento Incluído com Sucesso!");
     $(".MsgRetorno")
     .html("<P style='margin:0; color:green;'>Documento Incluído com Sucesso!</P>")
     .fadeOut(1000, function(){ // callback
         $(this)  // seleciona a própria div
        .html("") // esvazia ela
        .show();  // mostra a div. Como ela está vazia, nada irá aparecer
     });
   }
   else
   {
      idcontrato = iddoc = 1;
      oper = 1;
     $("#op" + iddoc).html("<input type='button' onClick='AddExcDocCPS(\"" + idcontrato + "\", \"" + iddoc + "\", 1)'  value='Incluir' class='BT_Verde'>");
     //alert("Documento Excluído com Sucesso!");
     $(".MsgRetorno")
     .html("<P style='margin:0; color:red;'>Documento Excluído com Sucesso!</P>")
     .fadeOut(1000, function(){
         $(this)
        .html("")
        .show();
     });
   }
}

AddExcDocCPS();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="op1"></div>
<div class="MsgRetorno"></div>

4
  • Legal. Funcionou sim.. Agora se eu clico em vários botões rapidamente não da tempo de ele sumir. Tem como pausar o fade no meio pra iniciar outro? Commented 12/06/2018 às 18:42
  • tem, só um instante
    – Sam
    Commented 12/06/2018 às 18:53
  • Atualizei a resposta com um código onde tem // cancela se algum fade estiver ocorrendo.
    – Sam
    Commented 12/06/2018 às 18:58
  • Boaa... muito obrigado!!! Commented 13/06/2018 às 16:55

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .