diff --git a/wagtail/wagtailadmin/static_src/wagtailadmin/js/core.js b/wagtail/wagtailadmin/static_src/wagtailadmin/js/core.js
index 6b8c76762..fb35482f0 100644
--- a/wagtail/wagtailadmin/static_src/wagtailadmin/js/core.js
+++ b/wagtail/wagtailadmin/static_src/wagtailadmin/js/core.js
@@ -147,28 +147,37 @@ $(function() {
     $(document).on('click', 'button.button-longrunning', function(e){
         var $self = $(this);
         var $replacementElem = $('em', $self);
+        var reEnableAfter = 30; 
+        var dataName = 'disabledtimeout'
 
-        var timeoutLength = 30; // Button re-enables after this time (seconds), to allow for errors in submissions causing forms to be permanently un-usable
-        var dataname = 'disabledtimeout'
-
-        // Disabling a button prevents it submitting the form, so disabling must occur on a timeout only after this function returns
+        // Disabling a button prevents it submitting the form, so disabling 
+        // must occur on a brief timeout only after this function returns.
         var timeout = setTimeout(function(){
-            // save original button value
-            $self.data('original-text', $replacementElem.text());
+            if(!$self.data(dataName)) {
+                // Button re-enables after a timeout to prevent button becoming
+                // permanently un-usable
+                $self.data(dataName, setTimeout(function(){
+                    clearTimeout($self.data(dataName));
+                    
+                    $self.prop('disabled', '').removeData(dataName).removeClass('button-longrunning-active')
+                    
+                    if($self.data('clicked-text')){
+                        $replacementElem.text($self.data('original-text'));
+                    }
 
-            if(!$self.data(dataname)) {
-                $self.data(dataname, setTimeout(function(){
-                    clearTimeout($self.data(dataname));
-                    $self.prop('disabled', '').removeData(dataname).removeClass('button-longrunning-active')
-                    $replacementElem.text($self.data('original-text'));
-                }, timeoutLength * 1000));
+                }, reEnableAfter * 1000));
                 
                 if($self.data('clicked-text') && $replacementElem.length){
+                    // Save current button text
+                    $self.data('original-text', $replacementElem.text());
+                    
                     $replacementElem.text($self.data('clicked-text'));
-                }    
+                }
+
+                // Disabling button must be done last: disabled buttons can't be
+                // modified in the normal way, it would seem.
                 $self.addClass('button-longrunning-active').prop('disabled', 'true');                   
             }
-            
             clearTimeout(timeout);
         },10);   
     });
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/pages/create.html b/wagtail/wagtailadmin/templates/wagtailadmin/pages/create.html
index db8b1a65e..998b8c52c 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/pages/create.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/pages/create.html
@@ -26,11 +26,13 @@
             <ul>
                 <li class="actions">
                     <div class="dropdown dropup dropdown-button match-width">
-                        <input type="submit" value="{% trans 'Save as draft' %}" class="button" />
+                        <button type="submit" class="button-longrunning" tabindex="3" data-clicked-text="{% trans 'Saving...' %}"><span class="icon icon-spinner"></span><em>{% trans 'Save draft' %}</em></button>
                         <div class="dropdown-toggle icon icon-arrow-up"></div>
                         <ul role="menu">
                             {% if parent_page_perms.can_publish_subpage %}
-                                <li><input type="submit" name="action-publish" value="{% trans 'Publish' %}" class="button" /></li>
+                                <li>
+                                    <button type="submit" name="action-publish" value="action-publish" class="button-longrunning" tabindex="3" data-clicked-text="{% trans 'Publishing...' %}" {% if page.locked %}disabled {% endif %}><span class="icon icon-spinner"></span><em>{% trans 'Publish' %}</em></button>
+                                </li>
                             {% endif %}
                             <li><input type="submit" name="action-submit" value="{% trans 'Submit for moderation' %}" class="button" /></li>
                         </ul>
diff --git a/wagtail/wagtaildocs/templates/wagtaildocs/documents/add.html b/wagtail/wagtaildocs/templates/wagtaildocs/documents/add.html
index 9bb0b3b2d..575575ec7 100644
--- a/wagtail/wagtaildocs/templates/wagtaildocs/documents/add.html
+++ b/wagtail/wagtaildocs/templates/wagtaildocs/documents/add.html
@@ -21,7 +21,9 @@
                 {% for field in form %}
                     {% include "wagtailadmin/shared/field_as_li.html" with field=field %}
                 {% endfor %}
-                <li><input type="submit" value="{% trans 'Save' %}" /></li>
+                <li>
+                    <button type="submit" class="button-longrunning" data-clicked-text="{% trans 'Saving...' %}"><span class="icon icon-spinner"></span><em>{% trans 'Save' %}</em></button>
+                </li>
             </ul>
         </form>
     </div>