小JS库的问题

时间:2013-04-19 13:59:10

标签: javascript html5 function dom

我正在尝试编写一个小型JS验证库,以获得乐趣并学习JS。我们的想法是遍历表单标签中的元素,并根据其他自定义属性检查输入元素是否有效。

我现在停留在如何使用元素在同一个“原型”中调用函数

这是基于我正在尝试开发的教程,如果SE政策要求提及此代码的来源,请告诉我

代码将使用此函数从html doc调用

<script type="text/javascript">
    function processForm() {
        _('form1').validate();
    }
</script>

这是lib代码:

function _(id) {
if (id) {
    if (window === this) {
        return new _(id);
    }

    // We're in the correct object scop:
    // Init our element object and return the object
    this.e = document.getElementById(id);
    return this;
} else {
    return "NO ID PARAM WAS GIVEN";
}
}
_.prototype = {
validate    :function () {
                try {
                    var elem = this.e.elements;
                    for(var i = 0; i < elem.length; i++){
                        //alert(elem[i].getAttribute("id"));
                        // STUCK HERE, how to call the bgcolor function of this prototype
                        so i can change the bgcolor for the current elem of the loop ?
                    }
                }
                catch(err)
                {
                    alert(err.message);
                }
            },  

bgcolor: function (color) {
            this.e.style.background = color;
            return this;
        },
};

1 个答案:

答案 0 :(得分:1)

可能是这样的:

for (var i = 0; i < elem.length; i++){
    this.bgcolor(elem[i], "red");
}

bgcolor: function (el, color) {
    el.style.background = color;
    return this;
}

或者可能是默认为this的可选元素,与您在表单上运行的现有代码保持同步。

bgcolor: function (color, el) {
    el = el || this;
    el.style.background = color;
    return this;
}