GORKOMXO3
Newbie | Редактировать | Профиль | Сообщение | ICQ | Цитировать | Сообщить модератору
Mavrikii, спасибо, круто, заработало как надо!
Вы мне очень помогли, жаль нет кнопки на форуме +в карму или еще что-то)
Добавлено:
Mavrikii, реализовывая все выше указанное я упустил очень важное и сам в этом виноват , ведь эти радио переключатели в итоге нужны не только для того что бы выводить тот или иной текст из блоков, но они еще и являются частью формы которая должна как раз отправлять дальше в переменных содержание выбранных блоков, а поскольку в свойствах input type="radio" свойство value уже заданно "железно", (именно по нему происходит) выборка блоков текста, то из формы передается значения этих value, а мне нужно было, что бы передавался текст блока для дальнейшей обработки.
Вот думаю как теперь быть.
Вот код что сейчас имею:
Код:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>Работа с Radio Button в JQuery - Snipp.ru</title>
</head>
<body style="font-size: 14px; position: relative; padding: 15px 20px;">
<table width="200" border="1">
<!--форма обработки-->
<form action="obrabotra.php" method="post" target="_self">
<tbody>
<tr>
<td>
<p>
<label><input type="radio" name="radio" value="1"> Radio Button 1</label><br>
<label><input type="radio" name="radio" value="2"> Radio Button 2</label><br>
<label><input type="radio" name="radio" value="3"> Radio Button 3</label>
</p>
</td>
<td>
<div class="block-text" id="block-1">
Блок текста №1
</div>
<div class="block-text" id="block-2">
Блок текста №2
</div>
<div class="block-text" id="block-3">
Блок текста №3
</div>
</td>
</tr>
<tr>
<td>
<p>
<label><input type="radio" name="radio1" value="4"> Radio Button 4</label><br>
<label><input type="radio" name="radio1" value="5"> Radio Button 5</label><br>
<label><input type="radio" name="radio1" value="6"> Radio Button 6</label>
</p>
</td>
<td>
<div class="block-text" id="block-4">
Блок текста №4
</div>
<div class="block-text" id="block-5">
Блок текста №5
</div>
<div class="block-text" id="block-6">
Блок текста №6
</div>
</td>
</tr>
</tbody>
<input style="background: #C4FFC4; border: 2px solid #000000; color: #B90000" name="ok" type="submit" value="Сформировать" />
</form>
</table>
<style type="text/css">
.block-text {
display: none;
}
</style>
<script src="https://snipp.ru/cdn/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).on('change', ':radio', function(){
var target = $('#block-' + $(this).val());
target.siblings('.block-text').hide();
target.fadeIn(500);
});
</script>
</body>
</html>
|
|
