关于form表单中动态添加数据的验证

 

目的：对下图的日期,收据金额，费用类型...等数据进行验证（必填项之类的）

难处：和常见表单相比，这些属性是未知数量的，传统方法获取的都是一个元素

 

 

 

传统方法获取元素和验证

下面是标题的jsp页面和js判断，常用的判断语句

 

<td class="tit">标题</td>
<td colspan="7">
          <input type="text" name="reason" >
           <span class="warn" style="color: red"></span>
</td>

var reason = $("input[name='reason']").val();

if(reason.length>6){
bool=false;
$("input[name='reason']").next().text("*不要超过6个字符");

}

动态数据验证

下面是收据金额的jsp页面和js判断

 

<td>

    <input name="amountMoney"  type="text" class="aMoney"  />

    <span class="warn" style="color: red"></span>

</td>

$(".money").each(function() {
$(this).next().text("");
if (this.value == "") {
        bool = false;
        $(this).next().text("*必填信息");
} else if (!reg.test(this.value)) {
bool = false;
$(this).next().text("*格式错误");
}

});

因为收据金额的条数是未知的，我们可以用each()方法来对元素进行遍历