загрузить разные изображения для каждого элемента в списке

Question

Javascript:

     function changeMap()
    {
       imagesource =  "http://maps.google.com/maps/api/staticmap?size=500x500&maptype=hybrid&zoom=16&sensor=false&markers=color:blue|label:K|28.541250,77.204100" ;
       mapimage.src  = imagesource ;
    }

HTML-код:

         <select name="choose_colony" id="choose_colony" size="8" onchange="changeMap()" style="float: left;">
        <option value="1" >Big apartments</option> 
        .
        .
        <option value="999">plaza</option>
        </select>
        <img name="mapimage" src="" alt="Select your Colony" style="float: right;">

В этом случае, когда делается выбор в списке, вызывается changeMap и загружается изображение.Я хочу, чтобы каждый раз загружалось другое изображение в зависимости от выбранной опции.

в списке будет более 2000 записей.Учитывая это, каков наилучший способ сделать это?Я могу разобраться с частью if / then, но мой главный вопрос: можно ли поместить все адреса изображений длиной 2000 в сам файл html?Я надеюсь, что я был ясен ..

Answer 1

Существует два способа, который лучше всего зависит от ваших настроек:

1. есть адреса на стороне клиента (либо в HTML, либо лучше: в отдельный файл .js с использованием JSON формат).
2. есть адреса на стороне сервера, и использовать AJAX, чтобы спросить адрес, когда поле выбора изменяется.

Первый -

• самый быстрый для вашего пользователя, после загрузки страницы и файла .js
• требуется один большой перевод с сервера
• лучше всего использовать в сценарии, где полоса пропускания дешевле, чем время в пути или когда пользователь, вероятно, будет прокручивать поле выбора, требуя нескольких изображений за посещение (файл .js будет кэшироваться при дальнейших посещениях)

Второй сценарий -

• Немного медленнее для пользователя, каждый раз, когда он меняет окно выбора, ему приходится ждать поездки на сервер
• Требуется больше, но более короткие передачи с сервера
• лучше всего использовать в сценарии, когда пользователь посещает страницу только несколько раз и делает только несколько выборов.