Форум

masterfrag · #1 (**permalink**) 30.11.2013, 20:04

Случай не самый сложный как я понимаю, но своими мозгами дойти не могу.
Существует форма на сайте. В ней при селекте изменяются изображения на сайте.
Под один селект настроил без проблем, со вторым начались проблемы
Вот код:

pictures = new Array()
for(i=0;i<5;i++)
   {
    pictures[i] = new Image()
    if(i==0) pictures[i].src = "./images/shapka01.png"
    if(i==1) pictures[i].src = "./images/shapka02.png"
    if(i==2) pictures[i].src = "./images/shapka03.png"
    if(i==3) pictures[i].src = "./images/shapka04.png"
    if(i==4) pictures[i].src = "./images/shapka05.png"
   }
function l_image()
   {
    document.shapka.src = pictures[document.form1.item.selectedIndex].src
   }
   pictures = new Array()
for(j=0;j<5;j++)
   {
    pictures[j] = new Image()
    if(j==0) pictures[j].src = "./images/sharf01.png"
    if(j==1) pictures[j].src = "./images/sharf02.png"
    if(j==2) pictures[j].src = "./images/sharf03.png"
    if(j==3) pictures[j].src = "./images/sharf04.png"
    if(j==4) pictures[j].src = "./images/sharf05.png"
   }
function r_image()
   {
    document.sharf.src = pictures[document.form1.item.selectedIndex].src
   }

А это сама форма селектора:

<img src="images/formpole-1.png" class="left" /><select name=item onChange=l_image()>
        <option selected="selected">Шапка 1
        <option>Шапка 2
        <option>Шапка 3
        <option>Шапка 4
        <option>Шапка 5
      </select><img src="images/formpole-2.png" class="left" /><br />
<img src="images/formpole-1.png" class="left" /><select name=item onChange=r_image()>
        <option selected="selected">Коричн. "Bersar"
        <option>Синий шарф
        <option>Черный "Звездочка"
        <option>Черный "Bersar"
        <option>Коричн. "Звездочка"
      </select><img src="images/formpole-2.png" class="left" />

рони · #2 (**permalink**) 30.11.2013, 20:19

masterfrag,
2 селекта 2 массива !!! а не 1 на 2

danik.js · #3 (**permalink**) 30.11.2013, 20:36

for(i=0;i<5;i++)
   {
    pictures[i] = new Image()
    if(i==0) pictures[i].src = "./images/shapka01.png"
    if(i==1) pictures[i].src = "./images/shapka02.png"
    if(i==2) pictures[i].src = "./images/shapka03.png"
    if(i==3) pictures[i].src = "./images/shapka04.png"
    if(i==4) pictures[i].src = "./images/shapka05.png"
   }

Мда.. И как ты до такого докатился? Думаю этому кода дорога сюда: http://govnokod.ru/

masterfrag · #4 (**permalink**) 30.11.2013, 21:02

Подробнее можно?
Как мне сделать так, что бы код работал?

Сообщение от danik.js

for(i=0;i<5;i++)
   {
    pictures[i] = new Image()
    if(i==0) pictures[i].src = "./images/shapka01.png"
    if(i==1) pictures[i].src = "./images/shapka02.png"
    if(i==2) pictures[i].src = "./images/shapka03.png"
    if(i==3) pictures[i].src = "./images/shapka04.png"
    if(i==4) pictures[i].src = "./images/shapka05.png"
   }

Мда.. И как ты до такого докатился? Думаю этому кода дорога сюда: http://govnokod.ru/

Язычок свой остренький придержи за зубами. Если ты ничем помочь путным не можешь тогда не нужно гадости писать людям которые спрашивают помощи

danik.js · #5 (**permalink**) 30.11.2013, 21:23

Обиделась лялечка.. ути пути..ну не плачь, все будет хорошо.
Приношу свои глубочайшие извинения если Вас так задело мое высказывание по поводу «качества» Вашего кода и указание его места.

masterfrag · #6 (**permalink**) 30.11.2013, 21:30

Сообщение от danik.js

Обиделась лялечка.. ути пути..ну не плачь, все будет хорошо.
Приношу свои глубочайшие извинения если Вас так задело мое высказывание по поводу «качества» Вашего кода и указание его места.

Все замечания по качеству можете выразить сюда: http://citforum.ru/internet/javascript/exgraph.shtml

Я лишь пытался исправить так, как нужно мне и сейчас незнаю что мне делать дальше. Потому и спрашиваю

danik.js · #7 (**permalink**) 30.11.2013, 21:32

Если у тя не хватает ума как спросить чтобы объяснили что не так с кодом, так и быть, прощаю.

var pictures = [
    "./images/shapka01.png",
    "./images/shapka02.png",
    "./images/shapka03.png",
    "./images/shapka04.png",
    "./images/shapka05.png"
];

for (var i = 0; i < pictures.length; i++) {
    var image = new Image();
    image.src = pictures[i];
}

Но я бы хранил пути к картинкам в data-* атрибуте.

danik.js · #8 (**permalink**) 30.11.2013, 21:45

Если сходу, то я бы сделал примерно так (при желании можно легко добавить третий селект, четвертый, ..., сотый):

<!DOCTYPE html>
<img id="hat-image" />
<select id="hat-select">
    <option selected="selected" value="http://javascript.ru/forum/images/smilies/smile.gif">Шапка 1</option>
    <option value="http://javascript.ru/forum/images/smilies/mad.gif">Шапка 2</option>
    <option value="http://javascript.ru/forum/images/smilies/laugh.gif">Шапка 3</option>
</select>
<img id="scarf-image" />
<select id="scarf-select">
    <option selected="selected" value="http://javascript.ru/forum/images/smilies/yes4.gif">Синий шарф</option>
    <option value="http://javascript.ru/forum/images/smilies/agree.gif">Черный "Звездочка"</option>
</select>
<script>
    (function(){
        var selects = ['hat', 'scarf'];
        for (var i = 0; i < selects.length; i++) {
            var select = document.getElementById(selects[i] + '-select');
            var image = document.getElementById(selects[i] + '-image');
            bind(select, image);
            preload(select);
        }
        function bind(select, image) {
            select.onchange = function() {
                image.src = this.value;
            };
            select.onchange();
        }
        function preload(options) {
            for (var i = 0; i < options.length; i++) {
                new Image().src = options.value;
            }
        }
    })()
</script>

masterfrag · #9 (**permalink**) 02.12.2013, 01:48

danik.js,
Спасибо. Очень помог

Форум

Справочник

Discord чат

Курсы javascript