小编goo*_*Man的帖子

我的目的是在算法的设计,性能和跨浏览器兼容性方面对下面的脚本进行思考和批评.

我刚刚开始进入JavaScript,已经错过了很长一段时间.我的背景和经验是开发基于C/C++/PHP的RESTful后端.

为了理解语言和使用它的正确方法,我决定做一些我确信之前做过很多次的事情.但是学习使用新语言和范例通常会带来痛苦.

这是我尝试创建正常的表单处理和验证脚本/功能.为了降低复杂性并保持代码简单/干净,我决定使用HTML5自定义数据属性(data-*)为表单中的每个元素分配元数据:

1. 数据要求:正确还是错误.如果设置为true,则此参数使表单字段成为必需,因此不能为空.设置为false的值表示该字段是可选的.默认值为false.>

2. 数据类型:要执行的验证类型.示例包括"电子邮件","密码","数字"或任何其他"正则表达式".

这种形式的一个神话般的简单例子是:

<form action="postlistings" id="postlistings" enctype='multipart/form-data' method="post" class="postlistings">
    <ul class="login-li">
        <li>
            <input class="title" name="title" type="title" id="title" data-required="true" data-type="title"></a>
        </li>
        <li>
            <textarea name="body" id="elm1" class="elm1" name="elm1" data-type="body" data-required="true" >
            </textarea>
        </li>
        <li>
        <span class="nav-btn-question">Add Listing</span>
        </li>
    </ul>
</form>

提醒:这是我的第一段JavaScript代码.我们的想法是在传递表单名称时调用Form,以便在一个循环中检索并验证所有字段值以获得性能.验证涉及两个步骤,可以从上面描述的Data-*属性中猜到:

一世.检查所需的表单字段.

如果值无法满足步骤1要求,则会针对特定表单值提取配置中的错误消息.因此,对于无法满足此要求的所有值,将收集一组错误消息并将其传递给View.

II.执行相应的验证.

仅当所有值都通过步骤1时才会执行验证.否则,它们将按照上面1中所示的相同步骤执行.

function Form(){

    var args = Array.prototype.slice.call(arguments),
        formName = args[0],
        callback = args.pop(),
        userError = [{type: {}, param: {}}],
        requiredDataParam = 'required',
        typeDataParam = 'type',
        form = document.forms[formName],
        formLength = form.length || null,
        formElement …