расстояния 3

by Алексей Журавлев

HTML

<select class="city"></select>
<select class="city"></select>
<input class="dist" type="text" />

JavaScript

window.addEventListener("DOMContentLoaded", function() {
    var selects = document.querySelectorAll(".city"),
        dist = document.querySelector(".dist"),
        distance = {
            city: ["Москва","Питер","Рязань","Казань"],
            dist: [
                [706, 196, 812],
                [908, 1518],
                [820]
            ]
        };
    [].forEach.call(selects, function(select, ind) {
        distance.city.forEach(function(text, i) {
            select.options[i] = new Option(text, i)
        });
        select.addEventListener("change", function() {
            var a = selects[0].value, b = selects[1].value, d = distance.dist, val;
            val = d[a] && d[a][b - a - 1]||d[b] && d[b][a  - b - 1]||0
            dist.value = val
        })
    })
});