Перемещение курсора в JavaScript

Question

Я пытаюсь создать форму для ввода данных. Форма будет состоять из 70 предметов. Каждый ответ будет состоять из одного целого числа от 1 до 10. Я успешно создал форму, и она работает. ОДНАКО, я бы хотел, чтобы курсор продвигался к следующему элементу после ввода предыдущего ответа. Например, если вы нажмете «1» для первого ответа, курсор автоматически перейдет ко второму отклику. Вы вводите второй ответ, и курсор перемещается в третье поле и т. Д. И т. Д., Пока вы не введете все 70 ответов. Проблема в том, что я не знаю, как заставить курсор двигаться автоматически. Я попытался решить это в Excel, сдался, и теперь я пытаюсь с Javascript

Я нашел некоторый синтаксис на jsfiddle.net, и я создал форму. Однако я не знаю, как заставить его работать в «Блокноте». Я вставил синтаксис ниже. Сплошная строка отделяет то, что я понимаю, как html-код из java. Они плохо работают вместе в блокноте, и я понятия не имею, почему.

Заранее благодарим за ваше время. Они не учили нас этому в Корпусе морской пехоты!

<div class="container"> 
a: <input type="text" maxlength="5" /> 
b: <input type="text" maxlength="5" /> 
c: <input type="text" maxlength="5" /> 
</div> 

____________________________________________________ 

var container = document.getElementsByClassName("container")[0]; 
container.onkeyup = function(e) { 
    var target = e.srcElement; 
    var maxLength = parseInt(target.attributes["maxlength"].value, 10); 
    var myLength = target.value.length; 
    if (myLength >= maxLength) { 
     var next = target; 
     while (next = next.nextElementSibling) { 
      if (next == null) 
       break; 
      if (next.tagName.toLowerCase() == "input") { 
       next.focus(); 
       break; 
      } 
     } 
    } 
} 

Answer 1

Вставьте код JavaScript внутри тега <script> в HTML.

<div class="container"> 
    a: <input type="text" maxlength="5" /> 
    b: <input type="text" maxlength="5" /> 
    c: <input type="text" maxlength="5" /> 
</div> 
<script> 
    var container = document.getElementsByClassName("container")[0]; 
    container.onkeyup = function(e) { 
     var target = e.target; 
     var maxLength = parseInt(target.attributes["maxlength"].value, 10); 
     var myLength = target.value.length; 
     if (myLength >= maxLength) { 
      var next = target; 
      while (next = next.nextElementSibling) { 
       if (next == null) 
        break; 
       if (next.tagName.toLowerCase() == "input") { 
        next.focus(); 
        break; 
       } 
      } 
     } 
    } 
</script>