Проблема с областью JavaScript (или что-то)

Question

У меня есть этот фрагмент Javascript.Позже в функции мне понадобится переменная самый высокий_номер, и я могу ее сгенерировать нормально.Проблема в том, что самый высокий_номер кажется недоступным после завершения цикла for (например, после закрытия}).

function new_route(parts) {
    var highest_number = -1;

    alert(parts);
    if (parts[0] == "field") {} 
    else if (parts[0] == "option") {
        //find last option input id
        var select_container = "container_" + parts[2];
        var thisContainer = document.getElementById(select_container);
        var optionsList = thisContainer.getElementsByTagName("input");

        for (var i = 0; i < optionsList.length; i++) {
            var option_parts = optionsList[i].getAttribute("id").split("_");

            if (option_parts[0] == "option") {
                alert(option_parts);
                if (option_parts[2] > highest_number) {
                    highest_number = option_parts[2];
                }
            }
        }
        alert(highest_number);

        var labelNode = document.createElement("label");
        var inputNode = document.createElement("input");
    }
}

Почему это происходит?

Answer 1

Вы не предоставили всю необходимую информацию в вопросе, поэтому я работаю над вашим вопросом на днях.

По крайней мере, часть проблемы связана с getElementsByTagName('input'), поскольку она включает кнопку submit, у которой нет идентификатора.

Итак, когда вы доберетесь до:

var option_parts = optionsList[i].getAttribute("id").split("_");

Вы пытаетесь сделать .split() на null.

Если вы исключите элементы в цикле, у которых нет идентификатора, это сработает:

    for (var i = 0; i < optionsList.length; i++) {
             // if no ID, continue to the next item
        if( !optionsList[i].id ) continue;
        var option_parts = optionsList[i].getAttribute("id").split("_");

---

Примечание. Пожалуйста, включите соответствующую информацию в вопросе. Это экономит каждому время.

Вот jsFiddle вашего кода в действии. Это обновлено от скрипки, которую я отправил прежде. Вы можете использовать его, если у вас есть будущие вопросы относительно этого кода.

Answer 2

Окно предупреждения находится в руке оператора else.Попробуйте переместить его к реальному концу функции

function new_route (parts) {
  var highest_number = -1;

  alert (parts);
  if (parts[0] == "field") {
    } else if (parts[0] == "option") {
      //find last option input id
      var select_container = "container_"+parts[2];
      var thisContainer = document.getElementById (select_container);
      var optionsList = thisContainer.getElementsByTagName ("input");

      for (var i = 0; i< optionsList.length; i++) {
        var option_parts = optionsList[i].getAttribute("id").split("_");

        if (option_parts[0] == "option") {
          alert (option_parts);
          if (option_parts[2] > highest_number) {
            highest_number = option_parts[2];
          }
        }
      }
      alert (highest_number);

      var labelNode = document.createElement ("label");
      var inputNode = document.createElement ("input");
    }
    alert (highest_number); // Add Alert here!
  }

Answer 3

Когда вы получаете "option_parts", вы получаете массив строк .Вы должны убедиться, что вы явно конвертируете в целое число (ну, в числа).Сравнение будет выполнено как числовое сравнение на первой итерации, но как только вы установите для «самый высокий номер» значение «option_parts [2]», тогда это тоже будет строка.это:

   // ...
   var option_parts = optionsList[i].getAttribute("id").split("_");
   if (option_parts[0] === "option") {
     var index = parseInt(option_parts[2], 10); //  <----- the important thing
     if (index > highest_number)
       highest_number = index;
   }

Answer 4

Выполнение будет остановлено, если именованный элемент будет найден, но не найден. Дважды проверьте (используйте оповещения), что для поиска нужного идентификатора элемента используется document.getElementById

  var thisContainer = document.getElementById (select_container);

Убедитесь, что select_container - это то, что вы ожидаете.