Tab 키가 mozilla의 입력 양식에서 작동하지 않지만 Google 크롬에서 작동합니다.

Question

양식에 3 개의 입력 필드가 있습니다. 원하는 것은 사용자가 자신의 키보드에서 Tab 키 버튼을 사용하여 사용자가 원하는대로 사용할 수있게하려는 것입니다. 다음 입력 텍스트로 점프 ...

문제는 내 Google 크롬 브라우저에서 탭을 사용하여 제대로 작동하지만 TAB 버튼을 사용하는 Mozilla 브라우저에서는 다른 입력 텍스트로 바로 이동할 수 없습니다.

여기 내 양식은 내가 한 것입니다. tabindex를 추가하려하지만 mozilla에서는 작동하지 않습니다.

<form class="form-style col-lg-2 col-md-2 col-sm-2 col-xs-12 text-center"> 
    <div class="form-group"> 
<input tabindex="1" type="text" class="form-control input-xxlarge" id="data1" onkeypress='return event.charCode >= 48 && event.charCode <= 57' maxlength="2" placeholder="How would you rate yourself, on a scale of 1-12?"> 
    </div> 
    <div class="form-group"> 
     <input tabindex="2" type="text" class="form-control input-xxlarge" id="data2" onkeypress='return event.charCode >= 48 && event.charCode <= 57' maxlength="2" placeholder="What is your ideal goal, on a scale of 1-12?"> 
    </div> 
     <div class="form-group"> 

     <textarea tabindex="3" class="form-control input-xxlarge" id="comment" placeholder="Improvement ideas"></textarea> 
    <style type="text/css"> 
textarea { 
    resize: none; 

    min-height: 100px; 
    max-height: 200px; 
} 
</style> 
    </div> 
    <input tabindex="4" type="submit" class="btn btn-success btn-large" value="NEXT" disabled="disabled"> 
</form> 

덕분에 ... 당신은 TAB 키가 다음 제어에 집중할 수 있도록 할 필요가

Answer 1

.. 당신의 키를 누를 때 이벤트

onkeypress='return (event.charCode >= 48 && event.charCode <= 57) || event.charCode=0' 

에서

그리고 당신의 HTML 양식은 다음과 같습니다

<form class="form-style col-lg-2 col-md-2 col-sm-2 col-xs-12 text-center"> 
    <div class="form-group"> 
<input tabindex="1" type="text" id="txt1" onkeypress='return (event.charCode >= 48 && event.charCode <= 57) || event.charCode=0' class="form-control input-xxlarge" id="data1" maxlength="2" placeholder="How would you rate yourself, on a scale of 1-12?"> 
    </div> 
    <div class="form-group"> 
     <input tabindex="2" type="text" class="form-control input-xxlarge" id="data2" onkeypress='return (event.charCode >= 48 && event.charCode <= 57) || event.charCode=0' maxlength="2" placeholder="What is your ideal goal, on a scale of 1-12?"> 
    </div> 
     <div class="form-group"> 

     <textarea tabindex="3" class="form-control input-xxlarge" id="comment" placeholder="Improvement ideas"></textarea> 
    <style type="text/css"> 
textarea { 
    resize: none; 

    min-height: 100px; 
    max-height: 200px; 
} 
</style> 
    </div> 
    <input tabindex="4" type="submit" class="btn btn-success btn-large" value="NEXT" disabled="disabled"> 
</form>