JavaScript: назначение функции свойству, которое будет запускаться заново при каждом вызове свойства - PullRequest
0 голосов
/ 12 февраля 2011

Я создаю библиотеку html5 JS-форм.Идея состоит в том, чтобы превратить элементы с классом .form-item в редактируемые div содержимого, используя атрибуты данных элементов в качестве инструкций для типа элемента формы, проверки и т. Д., Которые следует создать.

Приведенный ниже код создает объект проверки для одного элемента формы, который проверяет, соответствует ли минимальная длина значения поля.Свойства объекта включают элемент DOM, к которому он применяется (el), минимальную длину для поля (minLen), сообщение об ошибке (msgError), которое должно отображаться, если эта минимальная длина не соблюдается, и функцию (submit), которая возвращаетпроверяет ли объект, отображая ли сообщение об ошибке, если это не так.

Однако функция свойства submit всегда возвращает false.Я почти уверен, что знаю почему, но я не уверен, что это лучший способ исправить это.Я считаю, что проблема, с которой я сталкиваюсь, связана с понятием закрытия.Свойство submit проверяет длину innerHTML элемента элемента формы и сравнивает его со свойством minLen.Но я думаю, что это происходит только в момент создания экземпляра объекта проверки, когда innerHTML.length всегда равен 0 (потому что элемент формы и объект проверки должны быть созданы до того, как пользователь сможет что-либо ввести в поле).Как мне изменить приведенный ниже код, чтобы функция свойства submit запускалась заново каждый раз, когда она вызывается (проверяя, таким образом, текущую длину innerHTML поля, а не длину в момент создания экземпляра)?

function formValidateMinLen(item){
    var minLen = item.attr('data-minLen');

    this.el = item;
    this.minLen = minLen;
    this.msgError = item.attr('data-error_minLen');
    this.submit = function(){
        if(this.el.html() >= this.minLen){
            return true;
        }else{
            this.el.after('<div class="msgError">' + this.msgError + '</div>');
            return false;
        }
    }
}

item = new formValidateMinLen($('#registration-form .form-item:first'));

Я придумал одно решение, которое заключается в передаче innerHTML элемента элемента формы в качестве аргумента функции свойства submit, например:

this.submit = function(html){
    if(html >= this.minLen){
        ...
    }

item = new formValidateMinLen($('#registration-form .form-item:first'));
item.submit($('#registration-form .form-item:first').html());

Однако мне не нравитсяэто решение, потому что кажется избыточным необходимость повторного указания элемента DOM в коде item.submit (поскольку объект уже содержит этот элемент DOM в своем свойстве el).

Итак ... что мне делать

1 Ответ

1 голос
/ 12 февраля 2011

Я идиот. Я сравнивал innerHTML с минимальной длиной, а не ДЛИНУ innerHTML с минимальной длиной. Теперь это работает:)

...