просто js - отправить все формы на странице + проверить, закончилась ли загрузка страницы в iframe

Question

Я создаю простой скрипт, в котором форма отправляется, а результат отправки формы перенаправляется в iframe.

Я хочу, чтобы js-код проверял, завершил ли iframe загрузку результата отправки формы полностьюи только затем получить содержимое этого iframe и отправить его мне в форме сообщения.

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

Также я хотел бы, чтобы простая функция javascript отправляла все формы на веб-странице в главном окневеб-браузер.

Answer 1

Вы можете использовать прослушиватель событий, когда документ готов в Chrome и FF, но IE не поддерживает это. Вместо этого в IE есть нечто, называемое readystate, с которым вы можете обработать событие change. Ниже приведены функции, которые должны обрабатывать все, что вам нужно для добавления обработчика событий. Вы захотите вызвать addLoadHandler, остальные поддерживают функции.

// Adds an onload handler for script and iframe elements (supports IE)
var _addLoadHandlerCallbackFired = {};
function addLoadHandler(element, callback) {
    if (typeof callback !== 'function') { return false; }

    var callbackID = generateNumericID();   // Generate an ID for the callback
    _addLoadHandlerCallbackFired[callbackID] = false;   // Initialize its state as not fired
    callback = queueCallback(callback, 'addLoadHandler:' + callbackID); // Support multiple callbacks on the same element
    var wrappedCallback = function() {  // Wrap callback to set state to fired when called
            _addLoadHandlerCallbackFired[callbackID] = true;
            return callback.call(element);
    };

    // Attach standard load handler
    addEventHandler(element, 'load', wrappedCallback);

    /* Hack to replicate element.onload in IE
    Adapted from Nick Spacek's code at https://gist.github.com/461797 */
    addEventHandler(element, 'readystatechange', function() {
            if ((element.readyState === 'loaded' || element.readyState === 'complete') && _addLoadHandlerCallbackFired[callbackID] === false) {
                return wrappedCallback.call(element);
            }
        });

    return true;
}

// Generates Locally Unique IDs (length parameter is optional)
function generateNumericID(length) {
    if (typeof length !== 'undefined' && typeof length !== 'number') { return false; }

    if (typeof length === 'undefined') {
        length = 20;    // Maximum length before the browser uses scientific notation
    }
    return Math.floor(Math.random() * Math.pow(10, length));
}

// Queues callback functions to be executed in FIFO order
var _callbacksQueues = {};
function queueCallback(callback, id) {
    if (typeof id === 'undefined') { id = callback; }

    if (typeof _callbacksQueues[id] === 'undefined') { _callbacksQueues[id] = []; }
    _callbacksQueues[id].push(callback);

    return function() {
        while (_callbacksQueues[id].length > 0) {
            _callbacksQueues[id].shift().apply(this, arguments);
        }
    };
}

// Attaches events with cross-browser support, properly setting the context of this
function addEventHandler(element, event, handler, capture) {
    if (!isDOMElement(element) || typeof event !== 'string' || typeof handler !== 'function') { return false; }
    if (event.substr(0,2) === 'on') { event = event.substr(2); }    // Strip the 'on' at the beginning of the event if it is present

    if (typeof element.addEventListener === 'function') {   // Primary way of adding event listeners
        if (typeof capture === 'undefined') { capture = false; }
        return element.addEventListener(event, handler, capture);
    } else if (typeof element.attachEvent !== 'undefined') {    // Special case for IE (also, strangely typeof element.attachEvent = 'object' in IE)
        return element.attachEvent('on' + event, function(e) { return handler.call(element, e); });
    } else {
        return false;
    }
}

// Adapted from isPlainObject in jQuery 1.5.2
function isDOMElement(object) {
    return object && (typeEx(object) === 'object') && (object.nodeType || isWindow(object));
};

/* Like typeof, but can tell different types of built-in objects apart
Adapted from jQuery 1.5.2 */
function typeEx(object) {
    var parameterType = typeof object;
    if (parameterType !== 'object') {
        return parameterType;
    } else {
        if (object instanceof Date) {
            return 'date';
        } else if (object instanceof Array) {
            return 'array';
        } else if (object instanceof RegExp) {
            return 'regexp';
        } else {
            return 'object';
        }
    }
}

/* A crude way of determining if an object is a window
Taken from jQuery 1.5.2 */
function isWindow(object) {
    return object && typeof object === "object" && "setInterval" in object;
}

Что касается отправки всех форм на странице. Вам просто нужно позвонить .submit на каждого. Следующий код сделает это:

var forms = document.getElementsByTagName('form');
for (var formIndex = 0; formIndex < forms.length; formIndex++) {
    forms[formIndex].submit();
}