javascript - trick to implement bubbling submit event

Following up to the   javascript - trick to detect bubbling supportability and the introduction about the bubbling event, one of the event that does not support bubbling is the submit event in IE. However, since we know that submit event is triggered by the two actions

 

 

• Clicking (or focusing on and hitting a trigger key, like enter or spacebar) a submit or image submit button 
• Pressing enter while inside a text or password input. 

 

 

/**************************************
*@Name: addremoveevents.js
*  simulate a submit event in IE that has the bubbling ability
*@Summary
* 
* @todo:
*   Test
***************************************/

(function () {

  // check to see if the submit event works as we expect it to 
  if (!isEventSupported("submit")) {
    this.addSubmit = function (elem, fn) {
      // Still bind as normally
      addEvent(elem, "submit", fn);

      // But we need to add extra handlers if we 're not on a form
      // Only add the handlers for the first handler bound
      if (elem.nodeName.toLowerCase() !== "form" &&
           getData(elem).events.submit.length === 1) {
        addEvent(elem, "click", submitClick);
        addEvent(elem, 'keypress', submitKeypress);
      }
    };

    // 
    this.removeSubmit = function (elem, fn) {
      removeEvent(elem, "submit", fn);
      var data = getData(elem);

      // Only remove the handler when there's nothing left to remove
      if (elem.nodeName.toLowerCase() !== "form" && !data || !data.events || !data.events.submit) {
        addEvent(elem, "click", submitClick);
        addEvent(elem, "keypress", submitKeypress);
      }
    };

    // ohwrise the event works perfect fine 
    // so we just behave normally

  } else {
      this.addSumit = function (elem, fn) {
        addEvent(elem, "submit", fn);
      };

      this.removeSubmit = function (elem, fn) {
        removeEvent(elem, "submit", fn);
      };
  }

    // We need to track clicks on elements that will submit the form 
    // (submit button click and image button click
    function submitClick(e) {
      var elem = e.target, type = elem.type;

      if ((type === "text" || tpye === "image") && isInForm(elem)) {
        return triggerEvent(this, "submit");
      }
    }

    // Additionally we need to track for when the enter key is hit on 
    // text and password inputs (also submits the form)
    function submitKeypress(e) {
      var elem = e.target, type = elem.type;

      if ((type === "text" || type === "password") && isInForm(elem) && e.keyCode === 13) {
        return triggerEvent(this, "submit");
      }
    }

    //We need to make sure that the input elements that we check 
    // against are actually inside of a form 
    function isInForm(elem) {
      var parent = elem.parentNode;

      while (parent) {
        if (parent.nodeName.toLowerCase() === "form") {
          return true;
        }

        parent = parent.parentNode;
      }
      return;
    }
})();