Зависимые radio buttons
Доброго времени суток, ув. сообщество. Возникла трудность.
Суть проблемы: Есть 2 блока radio button-ов. Нужно сделать их зависимыми, т.е. если выбрать в первом блоке 1-ю или 2-ю кнопку, то во втором блоке должна выбираться первая кнопка. А если выбрать 3-ю, то во втором должна выбираться 2-ая. Вот пример кода который сейчас есть, но он не корректно работает. Задача вроде бы не сложная, но не могу решить. Использую библиотеку jQuery
<div class="conteiner-fluid">
<div class="row">
<div id="block1">
<input type="radio" name="radio1" class="other">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio1" class="other">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio1" class="np">Lorem ipsum dolor sit amet.<br>
</div>
<br>
<div class="row" id="block2">
<input type="radio" name="radio2" class="cheque">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio2" class="cod">Lorem ipsum dolor sit amet.<br>
</div>
</div>
</div>
$(document).ready(function() {
$(".other").on('change', function(){
if($(".other").prop('checked')) {
//$(".cod").removeAttr('checked');
$(".cheque").('checked', true);
}
});
$(".np").on('change', function(){
if($(".np").prop('checked')) {
//$(".cheque").removeAttr('checked');
$(".cod").attr('checked', true);
}
});
});
|
seahunter,
а Сайт Javascript.ru тут причём? других тем типа jquery или Общие вопросы Javascript не заметили? сидите тут не дублируйте но помните. |
seahunter,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function() {
$(".other").on("click", function() {
$(".cheque").prop("checked", true)
});
$(".np").on("click", function() {
$(".cod").prop("checked", true)
})
});
</script>
</head>
<body>
<div class="conteiner-fluid">
<div class="row">
<div id="block1">
<input type="radio" name="radio1" class="other">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio1" class="other">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio1" class="np">Lorem ipsum dolor sit amet.<br>
</div>
<br>
<div class="row" id="block2">
<input type="radio" name="radio2" class="cheque">Lorem ipsum dolor sit amet.<br>
<input type="radio" name="radio2" class="cod">Lorem ipsum dolor sit amet.<br>
</div>
</div>
</div>
</body>
</html>
|
Прошу прощения.
|
| Часовой пояс GMT +3, время: 04:10. |