Собственно вот что имею:
<!DOCTYPE HTML>
<html>
<head> </head>
<body>
<script>
function f1()
{
var s = document.getElementById("select");
var t = document.getElementById("a1");
if(s.selectedIndex)
t.style.display = 'inline';
}
window.onload = function () { //ждем загрузки документа
var options = document.getElementById("options").children; //взять детей элемента #options
function f1() {
var index = this.options.selectedIndex // тут получается индекс выбранного элемента
for (var i = 0, l = options.length; i < l; i++) {
if (i == index) options[i].classList.add('show'); //если то-что выбрано равно номеру дитя - показать
else options[i].classList.remove('show'); //иначе - скрыть
}
}
document.getElementById("select").addEventListener('change', f1); //на это событие повесить f1
}
<input style="visibility: hidden; display: none;" class="formStatExport_input" type="text" id="statExportDateStart_input">
</script>
<select id="select" onchange = f1()>
<option>Первый вариант</option>
<option>Второй вариант</option>
<option>Третий вариант</option>
<option>Четвертый вариант</option>
<option>Пятый вариант</option>
</select>
<div id="options">
<p></p>
<input type="text" id="a1" />
<div>3</div>
<div>4</div>
<div>5</div>
</div>
</body>
</html>
Хочу вместо таблиц вставить картинки, но пока плохо представляю как это сделать и куда.