Форум

subbziro · #1 (**permalink**) 02.08.2015, 16:42

Доброго времени суток.

Суть проблемы такова, есть 2 картинки и 2 input radio, при нажатии на одну картинку включается 1 input, соответственно при нажатии на другую - другой input.

Написал скрипт, он переключает только один раз, хотелось бы чтобы можно было тыкать на картинку и все время менялся input.
Если глупый вопрос или такая тема уже была, извините, я новичок

EmperioAf · #2 (**permalink**) 02.08.2015, 16:59

<!DOCTYPE html>
<html>
<head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
 <title>ГГ</title>
<style>
*{
    margin:0;
    padding:0;
    outline: 0;
}

img{
    display: block;
    margin: 50px;
    cursor: pointer;
}

input{
    margin-left: 100px;
}
</style>
</head>
<body>
    <img src="http://teonote.ru/wp-content/uploads/sueta-poglotila.jpg" width="500" height="300" alt="">
    <input type="radio" checked>
    <img src="http://www.holylife.info/sites/default/files/cуета%20сует_0.jpg" width="500" height="300" alt="">
    <input type="radio">
    <script>
    var inputs = document.querySelectorAll('input[type="radio"]');
    var images = document.querySelectorAll('img');
    images[0].onclick = function(){
        inputs[0].checked = true;
        inputs[1].checked = false;
    }

    images[1].onclick = function(){
        inputs[0].checked = false;
        inputs[1].checked = true;
    }
    </script>

</body>
</html>

subbziro · #3 (**permalink**) 02.08.2015, 17:08

EmperioAf,
Спасибо большое! то что надо)

laimas · #4 (**permalink**) 02.08.2015, 17:22

Сообщение от subbziro

Написал скрипт, он переключает только один раз, хотелось бы чтобы можно было тыкать на картинку и все время менялся input.

Для этого скрипта не надо. Поместите кнопки в label, а изображение как фоновые для label. Для того чтобы работало правильно, имена у кнопок должны быть одни и те же.

Форум

Справочник

Discord чат

Курсы javascript