Javascript: как перебирать элементы и вызывать обработчик onblur для определенных элементов

Question

У меня есть случай, когда у меня есть куча текстовых полей и переключателей на экране, все построенные динамически с различными DIV. Существуют подпрограммы onblur для всех текстовых полей для проверки ввода, но в зависимости от выбора переключателя, текстовое поле может быть недействительным, если изначально оно было допустимым. Я не могу использовать onblur с переключателями, потому что они могут перейти от переключателя в одно из текстовых полей, которые были сделаны недействительными, и создать бесконечный цикл, так как я фокусируюсь на недопустимом элементе. Поскольку каждое текстовое поле имеет свои специальные параметры для вызовов onblur, я считаю, что лучший способ сделать это - вызвать событие onblur для текстовых полей, когда форма отправляется, чтобы убедиться, что все записи по-прежнему действительны с конфигурацией переключателей, которую они выбрали. Мне также нужно прекратить отправку, если одно из событий onblur возвращает false, чтобы они могли исправить неправильное текстовое поле. Это то, что я написал ...

    for (var intElement = 0; intElement < document.forms[0].elements.length; intElement = intElement + 1)
    {
        if (document.forms[0].elements[intElement].name.substr(3) == "FactorAmount") // The first 3 characters of the name are a unique identifier for each field
        {
            if (document.forms[0].elements[intElement].onblur())
            {
                return false;
                break;
            }
        }
    }

return true;

Первоначально у меня было (! Document.forms [0] .elements [intElement] .onblur ()), но предупреждающие сообщения от событий onblur не появлялись, когда у меня это было. Теперь всплывающие сообщения с предупреждениями появляются, но они все еще продолжают проходить по элементам, если обнаруживают ошибку. Я прошел через это с помощью отладчика в обоих направлениях, и он, кажется, зацикливается очень хорошо, но это либо 1) не остановка и возврат false, когда мне это нужно, либо 2) не выполнение моих предупреждающих сообщений, чтобы сообщить пользователю, что ошибка была. Может ли кто-нибудь помочь? Это, наверное, что-то глупое, что я делаю.

Вызываемый метод onblur выглядит следующим образом ...

function f_VerifyRange(tagFactor, reaMin, reaMax, intPrecision, sLOB, sIL, sFactorCode)
{
    var tagCreditOrDebit;
    var tagIsTotal;
    var tagPercentageOrDecimal;

    eval("tagCreditOrDebit = document.forms[0]." + tagFactor.name.substr(0,3) + "CreditOrDebitC");

    eval("tagIsTotal = document.forms[0]." + tagFactor.name.substr(0,3) + "IsTotal");
    eval("tagPercentageOrDecimal = document.forms[0]." + tagFactor.name.substr(0,3) + "PercentageOrDecimal");

    if (tagPercentageOrDecimal.value == "P")
    {
        reaMax = Math.round((reaMax - 1) * 100);
        reaMin = Math.round((1 - reaMin) * 100);

        if (parseFloat(tagFactor.value) == 0)
        {
            alert("Please enter a value other than 0 or leave this field blank.");

            f_SetFocus(tagFactor);
            return false;
        }

        if (tagIsTotal.value == "True")
        {
            if (tagCreditOrDebit.checked)
            {
                if (parseFloat(tagFactor.value) > reaMin)
                {
                    alert("Please enter a value less than or equal to " + reaMin + "% for a credit or " + reaMax + "% for a debit.");
                    f_SetFocus(tagFactor);
                    return false;
                }
            }
            else
            {
                if (parseFloat(tagFactor.value) > reaMax)
                {
                    alert("Please enter a value less than or equal to " + reaMin + "% for a credit or " + reaMax + "% for a debit.");
                    f_SetFocus(tagFactor);
                    return false;
                }
            }
        }
    }

    return true;
}

РЕДАКТИРОВАТЬ: Я думаю, я понял, почему это не работает, как ожидалось, но я все еще не знаю, как я могу добиться того, что мне нужно. Строка ниже ...

            if (!document.forms[0].elements[intElement].onblur())

или

            if (document.forms[0].elements[intElement].onblur())

не возвращает то, что возвращает одна функция onblur (f_VerifyRange). Вместо этого он всегда возвращает либо истину, либо ложь, несмотря ни на что. В первом случае он возвращает true, а затем завершает и прерывает отправку после первого текстового поля, даже если в первом текстовом поле не было ошибки. Во втором случае он возвращает false и проходит через все поля. Даже при том, что могли быть ошибки (которые он отображает), он не думает, что есть какие-либо ошибки, поэтому он продолжает отправку. Я думаю, что мне действительно нужно, как получить возвращаемое значение из f_VerifyRange, который является моей функцией onblur.

Answer 1

Этот вопрос слишком сложен для меня в это время ночи, но я дам вам несколько советов:

eval("tagCreditOrDebit = document.forms[0]." + tagFactor.name.substr(0,3) + "CreditOrDebitC");

Это может быть написано НАМНОГО лучше:

tagCreditOrDebit = document.forms[0][tagFactor.name.substr(0,3) + "CreditOrDebitC"];

В javascript везде, где вы можете использовать точечный синтаксис, вы можете использовать квадратные скобки.

document.body;
document['body'];
var b = 'body';
document[b];

Кроме того, подумайте о том, чтобы придать вашим формам какой-то идентификатор. Я понятия не имею, почему document.forms[0] был стандартным способом обращения к форме так долго ... если вы решите разместить другую форму на странице до этой, то все сломается!

Другие способы сделать это включают:

// HTML
<form name="myFormName">

// Javascript
var f = document.myFormName;

или

<form id="myFormId">

var f = document.getElementById("myFormId")

Answer 2

Вы не добились успеха с if (!...onblur()), потому что возврат onblur() всегда равен undefined при непосредственном использовании. OnBlur() - это Функция обработчика событий . Как вы обнаружили, вы должны создать обходной путь.

Answer 3

Я решил эту проблему с помощью глобальной переменной. Первоначально я установил значение g_bHardEditsPassed в true, при условии, что ошибок не будет. Затем в f_VerifyRange, каждый раз, когда я возвращаю значение, я ставлю строку перед ним, чтобы установить переменную g_bHardEditsPassed для соответствия. Затем я изменил цикл так, чтобы он выглядел следующим образом ...

    g_bHardEditsPassed = true;

    for (var intElement = 0; intElement < document.forms[0].elements.length; intElement = intElement + 1)
    {
        if (document.forms[0].elements[intElement].name.substr(3) == "FactorAmount")
        {
            document.forms[0].elements[intElement].onblur()
            if (!g_bHardEditsPassed)
            {
                g_bHardEditsPassed = true;
                return false;
            }
        }
    }

    return true;

Спасибо за все предложения. Я уверен, что JQuery особенно стоит того, чтобы заглядывать в будущее.

Answer 4

Во-первых, ради любви к Богу и всему святому, прекратите писать нативный javascript и помогите себе кое-что из этого jQuery :)

Во-вторых, начните использовать рамки проверки. Для jQuery jQuery Validate обычно работает очень хорошо. Он поддерживает такие вещи, как зависимости между различными полями и т. Д. Кроме того, вы можете легко добавлять новые правила, например действительные номера ISBN и т. Д.

Редактировать: Что касается вашего кода, я не уверен, что вы можете использовать onunload для этого, так как в этот момент пути назад нет, вы не можете прервать его. Вместо этого вы должны поместить этот код в событие onsubmit.