Question

我的表单包含5到6个文本字段形式的电话字段。一开始只能看到一个。根据特定条件显示其他字段。所有这些电话领域都有一个共同的类“电话类”。我点击提交按钮验证这些字段。这工作正常。现在我需要在场的模糊上验证这些字段。我无法使用我的代码。有人可以帮帮我吗？

小提琴 - http://jsfiddle.net/NjvJU/8/

HTML

 <div class="phoneclass">
<label for="owner_phone">Owner Phone:</label>
<div class="input-phone">
    <input type="text" id="owner_area_code" name="owner_area_code" minlength="3" maxlength="3" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">-</span>

    <input type="text" id="owner_local3" name="owner_local3" minlength="3" maxlength="3" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">-</span>

    <input type="text" id="owner_local4" name="owner_local4" minlength="4" maxlength="4" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">Ext.</span>

    <input type="text" id="owner_extn" name="owner_extn" maxlength="5" style="width: 40px" />
    <input type="hidden" id="owner_phone" />
</div>
</div>
<hr/>
<div class="phoneclass">
<label for="owner_phone1">Owner Phone1:</label>
<div class="input-phone">
    <input type="text" id="owner_area_code1" name="owner_area_code1" minlength="3" maxlength="3" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">-</span>

    <input type="text" id="owner_local31" name="owner_local31" minlength="3" maxlength="3" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">-</span>

    <input type="text" id="owner_local41" name="owner_local41" minlength="4" maxlength="4" title="Owner number has either been left blank or the data entered was invalid" style="width: 60px" /> <span class="inline-text">Ext.</span>

    <input type="text" id="owner_extn1" name="owner_extn1" maxlength="5" style="width: 40px" />
    <input type="hidden" id="owner_phone1" />
 </div>
 </div>
<div>
<input type="submit" id="submitBtn" />
</div>

JS

$('#submitBtn').click(function () {
$('.phoneclass').filter(':visible').each(function () {
    var arr=new Array();
    input.find('input[type=text]').each(function (index, value) {
        //alert($(value).val());
        arr.push($(value).val());
    });
    var first = arr[0];
    var sec = arr[1];
    validateFn(first,sec); 
});
});

$('.phoneclass').each(function () {
    $(this).find('input').each(function (index, value) {
        $(this).blur(function(){
            alert("blur");
            arr.push($(value).val());
            var first = arr[0];
            var sec = arr[1]; 
            alert(first+" "+sec);
            //validateFn(first,sec);
        });
    });
});

function validateFn(val1,val2){
//Validation code
var test1=val1;
var test2=val2;
alert(test1+test2);
return true;
}

我不应该使用id进行验证。多数民众赞成我使用div类迭代每个字段并进行验证。知道如何验证字段模糊吗？

提前致谢

Answer 1

根据我的理解，在下面的行中定义

 var arr=new Array();

Demo

试试我的updated Demo

on blur基于类验证输入文本字段

1 个答案: