title: Delaying default events in Javascript
body: <p>I would like to be able to delay the default action of an event until some other action has been taken.</p>
  <p><strong>What it's for:</strong> I'm trying to build a reusable, unobtrusive way to confirm actions with a modal-type dialogue. The key wishlist item is that any Javascript handlers are attached by a script, and not written directly inline.</p>
  <p>To make this truly reusable, I want to use it on different types of items: html links, checkboxes, and even other Javascript-driven actions. And for purely HTML elements like links or checkboxes, I want them to degrade gracefully so they're usable without Javascript turned on.</p>
  <p>Here's how I would envision the implementation:</p>
  <pre><code>&lt;a href=&quot;/somelink/&quot; class=&quot;confirm&quot;&gt;Some Link&lt;/a&gt;
  _________
  
  &lt;script&gt;
      attachEvent('a.confirm','click', confirmAction.fire)
  
      var confirmAction = (function(){
          var public = {
              fire: function(e){
                  e.default.suspend();
                  this.modal();
              },
              modal: function(){
                  showmodal();
                  yesbutton.onclick = this.confirmed;
                  nobutton.onclick = this.canceled;
              },
              confirmed: function(){
                  hidemodal();
                  e.default.resume();
              },
              canceled: function(){
                  hidemodal();
                  e.default.prevent();
              }
          }
          return public;
      })()
  
  &lt;/script&gt;
  </code></pre>
  <p>I know about the <code>e.preventDefault</code> function, but that will kill the default action without giving me the ability to resume it. Obviously, the <code>default</code> object with the <code>suspend</code>, <code>resume</code> and <code>prevent</code> methods is made up to illustrate my desired end.</p>
  <p>By the way, I'm building this using the <a href="http://www.extjs.com/products/extcore/manual/" rel="nofollow noreferrer">Ext.Core</a> library, if that helps. The library provides a good deal of normalization for handling events. But I'm really very interested in learning the general principles of this in Javascript.</p>