Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.06.2014, 21:39
Аспирант
Отправить личное сообщение для Webtest Посмотреть профиль Найти все сообщения от Webtest
 
Регистрация: 10.06.2014
Сообщений: 63

Сохранение цвета рамки DIV при нажатии, и сброс при нажатии на другой DIV этого класа
Здравствуйте.

У меня есть несколько ДИВов, можно ли сделать так, чтобы при нажатии на див у него менялся цвет рамки и сохранялся до того, как я нажму на другой див из этого же класса, вот простенький код:
<form method="post" >
<div class="div1" id="red"><input class="input1" type="radio" name="color" value="red"></div>
<div class="div1" id="green"><input class="input1" type="radio" name="color" value="green"></div>
<div class="div1" id="blue"><input class="input1" type="radio" name="color" value="blue"></div>
<input type="submit" value='submit'>
</form>
Ответить с цитированием
  #2 (permalink)  
Старый 29.06.2014, 15:37
Аспирант
Отправить личное сообщение для Webtest Посмотреть профиль Найти все сообщения от Webtest
 
Регистрация: 10.06.2014
Сообщений: 63

Никто мне не поможет?
Ответить с цитированием
  #3 (permalink)  
Старый 29.06.2014, 16:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,427

Webtest,
а сделать перебор div по изменению input и установить класс div у которого input отмечен?
Ответить с цитированием
  #4 (permalink)  
Старый 29.06.2014, 22:13
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 32,427

Webtest,
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .div1{
    border: 2px solid transparent;
  }
  </style>
  <script type="text/javascript">
 window.onload = function () {
    var a = document.querySelectorAll(".div1");
    Array.prototype.forEach.call(a, function (c) {
        c.querySelector("input").onclick = function () {
            Array.prototype.forEach.call(a, function (a) {
                var b = a.querySelector("input");
                a.style.borderColor = b.checked ? b.value : ""
            })
        }
    })
};
</script>
</head>
<body>
<form method="post" >
<label><div class="div1" id="red"><input class="input1" type="radio" name="color" value="red" ></div></label>
<label><div class="div1" id="green"><input class="input1" type="radio" name="color" value="green"></div></label>
<label><div class="div1" id="blue"><input class="input1" type="radio" name="color" value="blue"></div></label>
<input type="submit" value='submit'>
</form>
</body>
</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть div при нажатии на картинку SLameN jQuery 6 14.04.2014 21:27
При нажатии на ссылку раскрываются все div anonimous jQuery 1 09.08.2012 14:49