Я хочу построить таблицу с зависимыми значениями, такими как - если я нажму на страну, тогда все штаты должны отобразиться с выделенной страной.Если состояния больше, которые не помещаются в столбце по вертикали, добавьте прокрутку к столбцу состояний по вертикали.
<!DOCTYPE html>
<html>
<head>
<title>Select</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script type="application/javascript">
$(document).ready(function(){
$('#country1').click(function() {
$('.hideit').toggle("slide");
});
});
</script>
</head>
<body>
<style>
.container {
display: table;
border-collapse:collapse
}
.column {
display:table-row;
border: 1px solid black;
}
.cell {
display: table-cell;
border-collapse:collapse
width: 120px;
height: 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
</style>
<div class="container">
<div class="cell">
<div class="column"><a href="#" id="country1" >country1</a></div>
<div class="column">country2</div>
<div class="column">country3</div>
</div>
<div class="cell hideit">
<div class="column">state1</div>
<div class="column">state2</div>
<div class="column">state3</div>
</div>
<div class="cell ScrollStyle">
<div class="column">city1</div>
<div class="column">city2</div>
<div class="column">city2</div>
<div class="column">city3</div>
</div>
</div>
</body>
</html>
если я нажму на страну, все штаты должны отобразиться с выделенной страной.Если состояния больше, которые не помещаются в столбце по вертикали, добавьте прокрутку к столбцу состояний по вертикали.