jQuery函數onKeyUp焦點next/previous

Question

我正在構建一個移動驗證函數。四個輸入值相同的類。

function isNumberKeyNext(evt){ 
 
    
 
     var charCode = (evt.which) ? evt.which : event.keyCode; 
 
     if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) 
 
     { 
 
      return false; 
 
     } 
 
     else 
 
     { 
 
       if ((charCode == 8 || charCode == 46)) { 
 
        $(this).prev('input').focus(); 
 
       } else { 
 
        $(this).next().focus(); 
 
       } 
 
     } 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
 
<input type="number" class="mobile-verify pass" maxlength="1" name="code[]" onkeypress="return isNumberKeyNext(event)" /> 
 
    <input type="number" class="mobile-verify pass" maxlength="1" name="code[]" onkeypress="return isNumberKeyNext(event)" /> 
 
    <input type="number" class="mobile-verify pass" maxlength="1" name="code[]" onkeypress="return isNumberKeyNext(event)" /> 
 
    <input type="number" class="mobile-verify pass" maxlength="1" name="code[]" onkeypress="return isNumberKeyNext(event)" />

HTML。

我只想輸入數字，如果它是一個合適的數字，請關注下一個字段，如果退格鍵被按下，它應該關注前一個字段。我怎樣才能做到這一點？我在哪裏犯了一個錯誤？提前致謝。

Answer 1

使用此fiddle

HTML：

<div class="container"> 
<input type="number" id="1" class="mobile-verify pass" maxlength="1" name="code[]" onkeyup="return isNumberKeyNext(event,this)" maxlength="1"/> 
    <input type="number" id="2" class="mobile-verify pass" maxlength="1" name="code[]" onkeyup="return isNumberKeyNext(event,this)" maxlength="1" /> 
    <input type="number" id="3" class="mobile-verify pass" maxlength="1" name="code[]" onkeyup="return isNumberKeyNext(event,this)" maxlength="1"/> 
    <input type="number" id="4" class="mobile-verify pass" maxlength="1" name="code[]" onkeyup="return isNumberKeyNext(event,this)" maxlength="1"/> 
    </div> 

JS：

function isNumberKeyNext(evt,$this){ 

     var charCode = (evt.which) ? evt.which : event.keyCode; 
     if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57)) 
     { 
      $($this).val(''); 
      return false; 
     } 
     else 
     { 
       if ((charCode == 8 || charCode == 46)) { 
        $($this).prev('input').focus(); 
       } else { 
        $($this).next('input').focus(); 
       } 
     } 
    }