|
Сообщение от angek
|
|
Подскажите в каком направлении копать
|
Как вариант...
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
label {
display: block;
}
label + label {
margin-top: 5px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('input:checkbox').change(function (){
if (this.checked) {
open($(this).data('child'));
} else {
close($(this).data('child'));
};
});
});
function open(Name) {
$('.o-'+Name).attr('disabled',false);
};
function close(Name) {
$('.'+Name).attr({
disabled: true,
checked: false
});
};
</script>
</head>
<body>
<div ="lv-1">
<h1>Уровень 1</h1>
<label><input type="checkbox" data-child='typ-1-1' />1-1</label>
<label><input type="checkbox" data-child='typ-1-2' />1-2</label>
</div>
<div ="lv-2">
<h1>Уровень 2</h1>
<label><input class='typ-1-1 o-typ-1-1' disabled type="checkbox" data-child='typ-2-1' />2-1</label>
<label><input class='typ-1-2 o-typ-1-2' disabled type="checkbox" data-child='typ-2-2' />2-2</label>
</div>
<div ="lv-3">
<h1>Уровень 2</h1>
<label><input class='typ-1-1 typ-2-1 o-typ-2-1' disabled type="checkbox" />3-1</label>
<label><input class='typ-1-2 typ-2-2 o-typ-2-2' disabled type="checkbox" />3-2</label>
</div>
</body>
</html>