Javascript-форум (https://javascript.ru/forum/)
-   (X)HTML/CSS (https://javascript.ru/forum/xhtml-html-css/)
-   -   Изменение картинки по radiobutton (https://javascript.ru/forum/xhtml-html-css/65302-izmenenie-kartinki-po-radiobutton.html)

Meattale 11.10.2016 21:59

Изменение картинки по radiobutton
 
как сделать, чтобы в зависимости от положения кружка - была та или иная картинка? Есть код:
window.addEventListener("DOMContentLoaded", function() {
    [].forEach.call( document.querySelectorAll('.selz1'), function(el) {
    var inputs = el.querySelectorAll("input.wicartoptional"),
        selects = el.querySelectorAll("select.wicartoptional"),
        ops = selects[1].querySelectorAll("option"),
        obj = {
            0: {
                0: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                1: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                2: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                3: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
				4: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
            },
            1: {
                0: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                1: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                2: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                3: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
				4: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
            }
        },
        op = obj[0];

    function change() {
        var i = selects[0].selectedIndex || 0;
        i = op[i];
        selects[1].options.length = 0;
        i.forEach(function(o) {
            selects[1].appendChild(ops[o])
        })
    }
    selects[0].addEventListener("change", change);
    [].forEach.call(inputs,
        function(input, i) {
            if(input.checked) {op = obj[i];
            document.querySelector(".im").src = ["upload/cartimg/psbsngroof.gif"][i]; change();
            }
            input.addEventListener("change", function() {
                document.querySelector(".im").src = ["upload/cartimg/psbsroof.gif","upload/cartimg/psbswall.gif"][i];
                input.checked && (op = obj[i]);
                change()
            })

        })

    });
});

тут все работает, но стоит здесь еще выборка числа в зависимости от других select. Как сделать только смену картинки и ничего более?:help:

рони 11.10.2016 22:33

Meattale,
интересно, поймёт ли кто, чего вы хотите сделать ...

Meattale 13.10.2016 15:00

рони, речь идет о написанном Вами же ранее коде: ссылка тут radiobutton & select связаны, как убрать select и оставить только radiobutton с функцией изменения картинки:)

рони 13.10.2016 16:57

Meattale,
уберите строки change()

рони 13.10.2016 17:11

Meattale,
window.addEventListener("DOMContentLoaded", function() {
    [].forEach.call( document.querySelectorAll('.sel'), function(el) {
    var inputs = el.querySelectorAll("input.wicartoptional"), img = el.querySelector(".im");
    [].forEach.call(inputs,
        function(input, i) {
            if(input.checked) {
            img.src = ["http://javascript.ru/forum/images/smilies/dance3.gif","http://javascript.ru/forum/images/smilies/victory.gif"][i];
            }
            input.addEventListener("change", function() {
                img.src = ["http://javascript.ru/forum/images/smilies/dance3.gif","http://javascript.ru/forum/images/smilies/victory.gif"][i];
            })

        })

    });
});

Meattale 13.10.2016 17:17

рони,
почему то теперь картинка не изменяется в принципе. Независимо от rb'
upd: Разобрался, спасибо большое!


Часовой пояс GMT +3, время: 15:44.