onBlur区号

Question

我试图做的是检查，看看他们是否输入了3个号码的地区代码，然后当他们输入3移动到下一个字段。3必须输入数字。我试过几种方法。

更新:我还试图确保他们在区号、电话前缀和电话后缀中设置了3位所需的3位数字。

我觉得我不应该用这个.我想..。

表格代码：

            <div class="formPhone" style="float:left;">
            (<input name="areaCode" id="areaCode"  type="text"  maxlength="3"
                onkeyup="validateNextField(this,3,phonePrefix);" 
                onblur="validateFixedLengthNumericField(this,3);"  
                style="font-size:11px; width:20px;"  title="Area Code" autocomplete="off">) 
            <input name="phonePrefix" id="phonePrefix" type="text" 
                onkeyup="validateNextField(this,3,phoneSuffix);" 
                onblur="validateFixedLengthNumericField(this,3);"  
                style="font-size:11px; width:20px;" maxlength="3"  title="Phone Prefix" autocomplete="off">-
            <input name="phoneSuffix" id="phoneSuffix" type="text"  maxlength="4" 
                onkeyup="validateNextField(this,3,phoneExtension);" 
                onblur="validateFixedLengthNumericField(this,4);"  
                style="font-size:11px; width:25px;" title="Phone Suffix" autocomplete="off"> 
            ext: 
            <input name="phoneExtension" id="phoneExtension" type="text"  maxlength="5" 
                onkeyup="validateNextField(this,5,dsnPrefix);" 
                style="font-size:11px; width:25px;" title="Phone Extension" autocomplete="off">
        </div>

JavaScript码

function validateFixedLengthNumericField(numericField, len){

    if (len != numericField.value.length){
        numericField.focus();   
        alert('Field must contain exactly '+len+' numbers.');
    }
}

// Once the max length is reached it forwards to the next field.
function validateNextField(numericField, len, nextField){

    if (len == numericField.value.length){
        nextField.focus();
    }
}

Answer 1

这应该适用于你：

document.getElementById('areaCode').addEventListener('keyup',function(){
    if(this.value.length == 3)
    {
        document.getElementById('phonePrefix').focus();
    }
},false);

document.getElementById('phonePrefix').addEventListener('keyup',function(){
    if(this.value.length == 3)
    {
        document.getElementById('phoneSuffix').focus();
    }
},false);

示例：http://jsfiddle.net/AlienWebguy/wnSZQ/