Обнаружение form.submit() выполняется через JavaScript

На моей странице есть рамка, которая принадлежит тому же домену. Содержание этого кадра разнообразно и относительно непредсказуемо. Всякий раз, когда пользователь нажимает кнопку (внутри рамки), которая выполняет публикацию, мне нужно выполнить функцию, которая выполняет некоторые задачи пользовательского интерфейса. Проблема в том, что я не могу редактировать источник этих кадров по независящим от меня причинам. Некоторые из этих кнопок являются простыми кнопками отправки формы, но другие не отправляют форму напрямую, а вместо этого имеют обработчик onclick, который выполняет некоторые проверки и может отправить.

Вот проблема: Как я могу обнаружить, если один из этих обработчиков onclick называется form.submit()? Если нет обработчика, то, очевидно, я могу настроить обработчик для onsubmit(), но это не так для всех этих кнопок.

Это мой код до сих пор:

function addEventBefore(element, type, before, after) {
  var old = element['on' + type] || function() {};
  before = before  || function() {};
  after = after || function() {};
  element['on' + type] = function () { 
    before();
    old();//I can't modify this old onclick handler
    after();
  };
}

function setup() {
  console.log('setup');
}


function takedown() {
// In this method, I want to know if old() caused a form submit
  console.log('takedown');
}

function $includeFrames(jQuery, selector) {
    return jQuery(selector).add(jQuery('iframe').contents().find(selector));
}

var a = $includeFrames($, 'input[type="submit"], input[type="button"]').each(function() {
    var elem = $(this)[0];
  addEventBefore(elem, 'click', setup, takedown);
});

2 ответа

Решение

Решение, которое сработало для меня, пришло от моего друга. Решением является использование функции form.submit().

$(function() {
    var el = document.getElementById('myform');
    el.submit = function(fn) {
        return function() {
            myFunctionGoesHere();
            fn.apply(this, arguments);
        };
    }(el.submit);
});

Вот рабочий пример: http://jsfiddle.net/hW6Z4/9/

В событии onload iframe вам нужно подключить прослушиватель событий к каждой форме на странице iframe. Вы должны делать это при каждой загрузке, поскольку каждая новая страница нуждается в новых слушателях.

$("#someIframe").on('load',function() {
    $(this).contents().find("form").each(function() {
        $(this).on('submit',function() {... your code...})
    })
}
Другие вопросы по тегам