Problèmes d'affichage JQuery?

Question

Je suis nouveau à JQuery et je me demandais comment puis-je avoir Changes saved! affiché une seule fois même si l'utilisateur appuie sur le bouton soumettre plusieurs fois, par exemple si un utilisateur décide d'y changer trois fois le texte, Changes saved!Changes saved!Changes saved! est affiché voulez Changes saved! affiché une fois.

Comment puis-je résoudre ce problème? Quelle partie de mon code doit être réparée?

Voici le code JQuery.

$(function() { 
    $('#changes-saved').hide(); 
    $('.save-button').click(function() { 
     $.post($('#contact-form').attr('action'), $('#contact-form').serialize(), function(html) { 
      $('div.contact-info-form').html(html); 
      $('#changes-saved').append('Changes saved!').show(); 
     }); 

     $('a').click(function() { 
      $('#changes-saved').empty(); 
      $('#changes-saved').hide(); 
     }); 

     return false; // prevent normal submit 
    }); 
}); 

Answer 1

Vous pouvez simplement définir le code HTML en utilisant .html(), ceci remplacera l'ancienne valeur:

$('#changes-saved').html('Changes saved!').show(); 

.append() ajoutera à ce qui est là, .html() le remplace.

Answer 2

Vous pourriez avoir une envergure sur la page avec vos "changements enregistrés!" blurb et l'initialiser comme display: none

<span style="display:none" id="changes-saved">Changes Saved</span> 

Puis

$('#changes-saved').show();