Disable Submit Button

by Ilmv

HTML

<input type="submit" data-placeholder-text="Saving..." />
<input type="submit" data-placeholder-text="Waiting..." />
<input type="submit" data-placeholder-text="Uploading..." />
<input type="submit" data-placeholder-text="Working..." />
<input type="submit" />
<br />
<p></p>

CSS

input {
    font-size: 60px; 
    float: left;
    clear: both;
    padding: 15px;
    margin-bottom: 15px;
}

JavaScript

$(document).ready(function() {

    $('input').click(function(event) {

        event.preventDefault();

        var self = $(this);

        // $('p').append('clicked<br />');
        
        var placeholder = self.val();
        
        if (self.data('placeholder-text') !== undefined) {
            placeholder = self.data('placeholder-text');
        }
        
        self.attr('disabled', true).val(placeholder);

        setTimeout(function() {
            self.removeAttr('disabled').val('Submit');
        }, 5000);

    });

});