Выпадающее меню уменьшить область глобальной переменной

Question

Как глобальная переменная «x» может быть уменьшена в области до локальной переменной? Обратите внимание, что просто перемещение «var x» внутри функции showAddress не будет работать, поскольку прослушиватель событий keyup сбросит переменную до 0 evetytime. Любая помощь приветствуется.

document.getElementById("where").addEventListener("keyup", showAddress, false); 

var x = 0; 

function showAddress (e) { 

    var search = document.getElementById("where").value; 
    if (search.length < 2) { 
     document.getElementById("addressNav").innerHTML = ''; 
     return 0; 
    } else { 
     var hr = new XMLHttpRequest(); 
     var url = "/handlers/suggestAddress.php"; 
     hr.open("POST", url, true); 
     hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
     hr.onreadystatechange = function() { 
      if (hr.readyState == 4 && hr.status == 200) { 
       document.getElementById("addressNav").innerHTML = hr.responseText; 


       // click on the address 
       var divs = document.getElementById("addressNav").getElementsByTagName("div"), i; 
       for (i = 0; i < divs.length; i++) { 
        divs[i].onclick = function() { 
         document.getElementById("where").value = this.innerHTML; 
         document.getElementById("addressNav").innerHTML = ''; 
        }; 
       } 

       //navigate address from keyboard 
       if (e.keyCode == 38) { 
        if (x > 0) { 
         x -= 1; 
        } else { 
         x = divs.length - 1; 
        } 
       } else if (e.keyCode == 40) { 
        if (x < divs.length - 1) { 
         x += 1; 
        } else { 
         x = 0; 
        } 
       } else { 
        if (e.keyCode == 13) { 
         document.getElementById("where").value = divs[x].innerHTML; 
         document.getElementById("addressNav").innerHTML = ''; 
        } 
       } 

       divs[x].setAttribute("class", "addressListKeyboard"); 
       console.log(x); 
      } 
     }; 
     hr.send("search=" + search); 
    } 
} 

Answer 1

Переменная x должна помнить последний выбранный div и поэтому имеет глобальный охват. Перемещение его в локальную область не будет работать, поскольку showAddress - это обработчик события keyup, который будет стирать значение x каждый раз, когда произойдет событие keyup.