Question

我正在创建一个html5 JS表单库。我们的想法是将带有.form-item类的元素转换为内容可编辑的div，使用元素的data-attributes作为应该创建的表单项类型，验证等的指令。

下面的代码为单个表单项创建验证对象，该表单项检查是否满足字段值的最小长度。对象的属性包括它应用于（el）的DOM元素，字段的最小长度（minLen），如果不满足最小长度则应显示的错误消息（msgError），以及返回的函数（submit）对象是否有效，如果没有则显示错误消息。

但是，submit属性函数始终返回false。我很确定我知道为什么，但我不确定纠正它的最佳方法。我相信我遇到的问题与闭包的概念有关。 submit属性检查表单项元素的innerHTML的长度，并将其与minLen属性进行比较。但我认为这只发生在验证对象实例化的那一刻，当innerHTML.length始终为0时（因为表单项和验证对象必须在用户能够在字段中输入任何内容之前创建））。我应该如何修改下面的代码，以便commit属性函数在调用时重新运行（从而检查字段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());

但是，我不喜欢这个解决方案，因为在item.submit代码中重新指定DOM元素似乎是多余的（因为对象已经在其el属性中包含了该DOM元素）。

所以...我该怎么办？

Answer 1

我是个白痴。我将innerHTML与最小长度进行比较，而不是将innerHTML的LENGTH与最小长度进行比较。现在它有效：）

JavaScript：将函数分配给每次调用属性时将重新运行的属性

1 个答案: