вывод по радиокнопке
Добрый день, разбираюсь с радиокнопками.
Возникло 2 вопроса
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<input type="radio" name="user" id="r1" class="user" checked="checked">Один</input><br>
<input type="radio" name="user" id="r2" class="user">два</input><br>
<input type="radio" name="user" id="r3" class="user">три</input><br>
<label id="one" style="display:block;">Один</label>
<label id="two" style="display:none;">два</label>
<label id="three" style="display:none;">три</label>
<label id="one" style="display:block;">Один</label>
<label id="two" style="display:none;">два</label>
<label id="three" style="display:none;">три</label>
<label id="one" style="display:block;">Один</label>
<label id="two" style="display:none;">два</label>
<label id="three" style="display:none;">три</label>
<script>
var inp = document.getElementsByClassName('user');
var one = document.getElementById('one');
var two = document.getElementById('two');
var three = document.getElementById('three');
function func (elm) {
if (elm.id == "r1" && elm.checked)
one.style.display = "block";
else
one.style.display = "none";
if (elm.id == "r2" && elm.checked)
two.style.display = "block";
else
two.style.display = "none";
if (elm.id == "r3" && elm.checked)
three.style.display = "block";
else
three.style.display = "none";
}
for (var i=0;i<inp.length;i++){
inp[i].onchange = function () {func(this)};
}
</script>
</body>
</html>
1. Мне надо заменить значения во всех label, а не только в первой тройке, как это сделать и 2. Как делать на форуме что бы можно было запускать скрипт, т.е. появлялась кнопочка просмотреть |
Цитата:
[HTML run][/HTML] О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting. |
Я, конечно, могу ошибаться, но попробуй прописать зависимость If
с вызовом div-а или span-а с текстом |
Спасибо, исправил, а по первому вопросу ничего не подскажите?
|
Цитата:
|
dantist433,
id почему одинаковые замените на класс, и может span а не label? |
dantist433,
для данной структуры скрипт не нужен достаточно css |
Цитата:
<style type="text/css">
input:checked + label {
display: inline-block;
}
label{
display: none;
}
</style>
Или вы не это имели ввиду? |
Цитата:
|
dantist433,
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<style type="text/css">
label {
display: none;
}
#r1:checked ~ label:nth-child(3n+1) {
display: inline-block;
}
#r2:checked ~ label:nth-child(3n+2) {
display: inline-block;
}
#r3:checked ~ label:nth-child(3n) {
display: inline-block;
}
</style>
</head>
<body>
<input type="radio" name="user" id="r1" class="user" checked="checked">Один<br>
<input type="radio" name="user" id="r2" class="user">два<br>
<input type="radio" name="user" id="r3" class="user">три<br>
<label >Один</label>
<label >два</label>
<label >три</label>
<label >Один</label>
<label >два</label>
<label >три</label>
<label >Один</label>
<label >два</label>
<label >три</label>
</body>
</html>
|
| Часовой пояс GMT +3, время: 06:12. |