Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   По нажатию на картинки меняется checked на radiobutton (https://javascript.ru/forum/events/36937-po-nazhatiyu-na-kartinki-menyaetsya-checked-na-radiobutton.html)

wedding 01.04.2013 19:00

По нажатию на картинки меняется checked на radiobutton
 
Помогите, пожалуйста, со скриптом.

Есть несколько картинок <img src="img/1.gif" <img src="img/2.gif"...
и под каждой есть свой radiobutton
<input type="radio" name="radiobutton" value="1"> ... value="2"> ...

Один из radiobutton (который по умолчанию) включен.
Как менять checked на этой группе radiobutton по нажатию на соответствующую картинку?

schmetterling 01.04.2013 19:30

http://htmlbook.ru/html/label

danik.js 01.04.2013 19:31

<style>label{display:inline-block}</style>
<label>
    <img src="//javascript.ru/forum/images/smilies/yes4.gif" /><br />
    <input type="radio" name="bla" />
</label>
<label>
    <img src="//javascript.ru/forum/images/smilies/tongue.gif" /><br />
    <input type="radio" name="bla" />
</label>

Правда такое поведение не гарантируется на всех платформах

cyber 01.04.2013 20:58

danik.js, ИЕ против такого решения ;)

wedding 02.04.2013 01:40

С <label> это не работает в IE.
Может что-то на JavaScript ? По событию onclick на картинках...

danik.js 02.04.2013 01:43

До чего ж тупые у ишака баги..
<style>label{display:inline-block}</style>
<label>
    <img onclick="parentNode.click()" src="//javascript.ru/forum/images/smilies/yes4.gif" /><br />
    <input type="radio" name="bla" />
</label>
<label>
    <img onclick="parentNode.click()" src="//javascript.ru/forum/images/smilies/tongue.gif" /><br />
    <input type="radio" name="bla" />
</label>

wedding 02.04.2013 01:54

Спасибо большое, danik

cyber 02.04.2013 10:07

danik.js, ИЕ снова против)))

cyber 02.04.2013 10:34

<!DOCTYPE HTML>
<html>
  <head><style>label{display:inline-block}</style> </head>
  <body>
    <div id="parent">
<label>
    <img class = "link-img" src="//javascript.ru/forum/images/smilies/yes4.gif" /><br />
    <input type="radio" name="bla"  />
      </label>
<label>
    <img   class = "link-img" src="//javascript.ru/forum/images/smilies/tongue.gif" /><br />
    <input type="radio" name="bla" />
</label>
    </div>
    
    <script>

var pr = document.getElementById("parent");
     
      
      pr.onclick = function (e) {
       
        var target = event.srcElement || e.target;
     
        if(target.className != "link-img") return;
        
       var elem = target.parentNode.getElementsByTagName("input")[0];
       
       elem.checked = true;
        
      
      };    

      
    </script>

  </body>
</html>

danik.js 02.04.2013 13:28

Цитата:

Сообщение от cyber
danik.js, ИЕ снова против)))

Неа. Теперь только IE7 против. А на него уже все давно *** положили :)

cyber 02.04.2013 14:00

danik.js,ИЕ 8 тоже;)

danik.js 02.04.2013 14:32

Цитата:

Сообщение от cyber
danik.js,ИЕ 8 тоже

Неа. Если только не в режиме IE7 или режиме совместимости или в прочей хренотени.

cyber 02.04.2013 14:36

danik.js, у меня в обычном режиме не работает...


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