简体   繁体   中英

Javascript onclick change button text for a few seconds

Trying to change the text on a button to processing for a few seconds when it is click

<div id="send"></div>

<button id="button">Send</button>

 <script> 
     $(document).on("click", "#button", function() {   
  var Path = $('#send').html();           
  var success = function() { alert("Successful"); };     
  var error = function(message) { alert("Oopsie! " + message); };  
</script>

You're close, you just need to do this $('#button').html("Processing");

Then in the success and error functions, you'll probably want to modify the button text to something else so that it no longer displays "Processing".

This is what you are probably looking for:

$(document).on("click", "#button", function() {  

    var defaultBtnValue = $('#send').html();
    $('#send').html("Processing..."); 

    $.ajax({
       url: your_url,
       type: "GET",
       success: function() {
           alert("Successful");
       },
       error: function(message) {
           alert("Oopsie! " + message);
       },
       complete: function() {
           $('#send').html(defaultBtnValue);
       }
    });
});

I'm assuming you wan't this "Processing" to show while something is.. well, processing, like doing an ajax call (this may be a setTimeout function as well). Good practice is to first save the default value of the button and make sure to reset it once an action is complete (succes or not) in case something goes wrong.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM