JavaScript: Asignación de una función a una propiedad que se ejecutará cada vez que se llama la propiedad

StackOverflow https://stackoverflow.com/questions/4979054

Pregunta

Estoy creando una biblioteca HTML5 JS Form. La idea es convertir elementos con una clase de .form-elemento en el contenido DIV editable, usando los atributos de datos de los elementos como instrucciones para el tipo de elemento de formulario, validación, etc. que se debe crear.

El código a continuación crea un objeto de validación para un elemento de forma única que verifica si se cumple la longitud mínima del valor de campo. Las propiedades del objeto incluyen el elemento DOM que se aplica a (EL), la longitud mínima para el campo (MINLEN), el mensaje de error (MSGError) que debe mostrarse si no se cumple esa longitud mínima y una función (Enviar) que devuelve Si el objeto valida, visualizando el mensaje de error si no lo hace.

Sin embargo, la función Enviar la propiedad siempre devuelve False. Estoy bastante seguro de que sé por qué, pero no estoy seguro de la mejor manera de corregirlo. Creo que el problema en el que estoy corriendo tiene que ver con la noción de un cierre. La propiedad Enviar verifica la longitud del iNNERHTML del elemento de elemento de formulario y lo compara con la propiedad MINLEN. Pero creo que esto solo sucede en el momento de la instanciación del objeto de validación, cuando la longitud inernhtml.length es siempre 0 (porque el elemento de formulario y el objeto de validación, debe crearse antes del usuario poder ingresar cualquier cosa en el campo ). ¿Cómo debo modificar el código a continuación para que la función de la propiedad de envío se ejecute de nuevo en cualquier momento en que se llama (verificando así la longitud actual del innerhtml del campo, en lugar de la longitud en el momento de la instanciación)?

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'));

Subí con una solución, que es pasar el INNERHTML del elemento de elementos de formulario como un argumento a la función de la propiedad Enviar, como esta:

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

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

Sin embargo, no me gusta esa solución porque parece redundante tener que volver a especificar el elemento DOM en el código del elemento.submit (ya que el objeto ya contiene ese elemento DOM en su propiedad EL).

Entonces ... ¿qué debo hacer?

¿Fue útil?

Solución

Soy un idiota.Estaba comparando el INNERHTML a la longitud mínima, en lugar de la longitud del INNERHTML a la longitud mínima.Ahora funciona :)

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top