глобальные вызовы функций по тегу возможны? - PullRequest
Новая
       29

глобальные вызовы функций по тегу возможны?

4 голосов
/ 25 ноября 2011

В моем исходном коде много примеров, подобных приведенным ниже: 

            <input id="a" type="text" name="a" maxlength="40"
             onfocus="ThisOnFocus(this)" onkeydown="ThisOnKeyDown(this)" onkeyup="ThisOnKeyUp(this)" onblur="ThisOnBlur(this)"/>

Каждый входной тег заканчивается этими вызовами функций onfocus, onkeydown, onkeyup и onblur.Вы хотите указать глобально, что все входные теги вызывают эти функции в этих событиях.Это то, что можно сделать в JavaScript?Спасибо!

Редактировать: я пытался поместить это в раздел скриптов, и ни одна из моих функций не вызывается: 

document.onload = function() { var inputs = document.getElementsByTagName('input');
    for (i = 0; i < inputs.length; i++) {
    inputs[i].onfocus = ThisOnFocus;
    inputs[i].onblur = ThisOnBlur;
    inputs[i].onkeyup = ThisOnKeyUp;
    inputs[i].onkeydown = ThisOnKeyDown;
    }
  }

Редактировать: Кроме того, может быть не важно различать вводфлажки и текстовые поля, но все эти функции относятся только к текстовым полям.

Ответы [ 4 ]

1 голос
/ 25 ноября 2011

Вы можете использовать захват и пузыриться.Обратите внимание, что для события фокусировки и размытия требуется захват.Кроме того, вы можете использовать события focusin и focusout.

Демонстрация в реальном времени: http://jsfiddle.net/t2KdS/

0 голосов
/ 25 ноября 2011

У вас есть несколько проблем:

  1. onload - это обработчик событий, применимый к объекту window.
  2. Ваши функции обработки событий ожидают параметр, которыйты не проходишь мимоНапример, в вашей разметке у вас есть ThisOnBlur(this), но в коде вы просто используете ThisOnBlur без передачи аргумента.

Вот как я бы изменил ваш код: 

function createEventHandler(fn, input) {
    return function () {
        fn(input);
    };
}

window.onload = function() {
    var inputs = document.getElementsByTagName('input');
    for (i = 0; i < inputs.length; i++) {
        inputs[i].onfocus = createEventHandler(
            ThisOnFocus, inputs[i]);

        inputs[i].onblur = createEventHandler(
            ThisOnBlur, inputs[i]);

        inputs[i].onkeydown = createEventHandler(
            ThisOnKeyDown, inputs[i]);

        inputs[i].onkeyup = createEventHandler(
            ThisOnKeyUp, inputs[i]);
    }
};

Функция createEventHandler позволяет вам получить ссылку на функцию, которая вызывает ваши существующие обработчики событий с правильными аргументами.

Вот пример: http://jsfiddle.net/YPNmd/

0 голосов
/ 25 ноября 2011

Это действительно вопрос слова global scope.Если ваш JS разбросан по нескольким файлам, вам придется записать код вышеуказанных ответов в файл, который вызывается перед основным файлом, который вызывает все остальные функции JS.

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

0 голосов
/ 25 ноября 2011

Посмотрите здесь: http://triaslama.wordpress.com/2008/07/22/four-ways-javascript-binding-event-listeners/

На вашем месте я бы выбрал jQuery.Но это выполнимо в чистом Javascript.:)

...