[kirito0709]

рони, cпасибо за уделенное время и ваше терпение. Увидел на сколько сильно у меня было неправильное мышление. Попытался с помощью справочника и учебника на данном сайте разобраться с вашим примером, но до конца не понял. Написал комментарии, но для части кода не смог этого сделать.

$(function() { //объявляем функцию
    var b = [0, 0, 0], //объявляем переменную в виде массива (не понял почему именно такие числа)
        d = [15, 3, 1]; //объявляем переменную в виде массива (не понял почему именно такие числа)
    $("#form1, #form2, #form3").each(function(e, c) { //здесь для каждого блока с указанными id объявляем функцмию с 2мя параметрами
        var f = $("input", c); //объявляем переменную f которая высчитывается по функции с параметрами input и c (не понял что за параметры)
        $(c).on("click", "input", function(a) { // 
            a = f.index(this); //видимо передаем в переменную "а" индекс кликнутой кнопки
            b[e] = a; //это я не понял
            a = b.reduce(function(a, b, c) { //передаем для каждого ранее определенного индекса массива его соотвествующее значение (более точно не могу понять это действие)
                return a + b * d[c] // возвращаем что-то. Что именно я не понял, а именно d[c] не понял
            }, 0); // не понял что за ноль()
            $("#result").html(++a + ' картинка') //тут увеличиваем значение "а"  на 1 и записываем полученное значение в переменную "а" и добавляем слово картинка
        })
    })
});

И еще вопрос. Я изначально выкладывал не весь код. Думал что сразу пойму что и как делать, но последний код с массивами меня, честно говоря, немного пришиб((.

И так я пытаюсь сделать такой калькурятор:



На скриншоте, код js прописан только для радио кнопок которые круглые. на объединении групп радиокнопок я застопорился. Тобишь на скрине картинки меняются только при переключении кнопок для пола.

Красным - выделены картинки которые у меня менялись. THUMB это миниатюра галлереи. На картинке не видно, но при нажатии на большую картинку PREVIEW , открывается детальная картинка DETAIL на весь экран.
Синим - выделен текст который я надеюсь потом превратить в вывод цены в зависимости от выбранных кнопок.

Картинки вставлял по клику на input

var img_nofloor_detail = "<?=$arResult['FLOOR_GALLERY']['0']['DETAIL']['SRC'];?>"
var img_floor_batten_detail = "<?=$arResult['FLOOR_GALLERY']['1']['DETAIL']['SRC'];?>"
var img_floor_dsp_detail = "<?=$arResult['FLOOR_GALLERY']['2']['DETAIL']['SRC'];?>"
var img_floor_dpk_detail = "<?=$arResult['FLOOR_GALLERY']['3']['DETAIL']['SRC'];?>"

var img_nofloor_thumb = "<?=$arResult['FLOOR_GALLERY']['0']['THUMB']['src'];?>"
var img_floor_batten_thumb = "<?=$arResult['FLOOR_GALLERY']['1']['THUMB']['src'];?>"
var img_floor_dsp_thumb = "<?=$arResult['FLOOR_GALLERY']['2']['THUMB']['src'];?>"
var img_floor_dpk_thumb = "<?=$arResult['FLOOR_GALLERY']['3']['THUMB']['src'];?>"

var img_nofloor_preview = "<?=$arResult['FLOOR_GALLERY']['0']['PREVIEW']['src'];?>"
var img_floor_batten_preview = "<?=$arResult['FLOOR_GALLERY']['1']['PREVIEW']['src'];?>"
var img_floor_dsp_preview = "<?=$arResult['FLOOR_GALLERY']['2']['PREVIEW']['src'];?>"
var img_floor_dpk_preview = "<?=$arResult['FLOOR_GALLERY']['3']['PREVIEW']['src'];?>"
//переменные могу передавать из пхп пока только так. хотя возможно смогу загрузить картинки в один массив так чтобы они стояли в нужном порядке и потом попытаться передать массив из пхп в js и создать ассоциативный массив где  для каждой ++a будет свой элемент массива сожержащий пути к картинкам
window.onload = function() {
$("#fr").click(function(){
document.getElementById('text_result').innerHTML = basetext;
document.querySelector('#slider>.flex-viewport>ul>li>a>img').src = img_nofloor_preview;
document.querySelector('#slider>.flex-viewport>ul>li>a').href = img_nofloor_detail;
document.querySelector('#carousel>.flex-viewport>ul>li>img').src = img_nofloor_thumb;
});

$("#zr").click(function(){
document.getElementById('text_result').innerHTML = batten;
document.querySelector('#slider>.flex-viewport>ul>li>a>img').src = img_floor_batten_preview;
document.querySelector('#slider>.flex-viewport>ul>li>a').href = img_floor_batten_detail;
document.querySelector('#carousel>.flex-viewport>ul>li>img').src = img_floor_batten_thumb;
});

$("#sr").click(function(){
document.getElementById('text_result').innerHTML = dsp;
document.querySelector('#slider>.flex-viewport>ul>li>a>img').src = img_floor_dsp_preview;
document.querySelector('#slider>.flex-viewport>ul>li>a').href = img_floor_dsp_detail;
document.querySelector('#carousel>.flex-viewport>ul>li>img').src = img_floor_dsp_thumb;
});
$("#tr").click(function(){
document.getElementById('text_result').innerHTML = dpk;
document.querySelector('#slider>.flex-viewport>ul>li>a>img').src = img_floor_dpk_preview;
document.querySelector('#slider>.flex-viewport>ul>li>a').href = img_floor_dpk_detail;
document.querySelector('#carousel>.flex-viewport>ul>li>img').src = img_floor_dpk_thumb;
});
}

Переменные могу передавать из пхп пока только так. хотя возможно смогу загрузить картинки в один массив так чтобы они стояли в нужном порядке и потом попытаться передать массив из пхп в js и создать ассоциативный массив где для каждой ++a будет свой элемент массива содержащий пути к картинкам.....


Глядя на ваш пример выше,

$("#result").html(++a + ' картинка')

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