<div class="panel panel-default">
<div class="panel-heading">Главная</div>
<div class="panel-body">
<ul>
<li><a data-toggle="collapse" class="spoiler-trigger" style="color: #337ab7;">Проверка_1</a>
</li>
<li><a data-toggle="collapse" class="spoiler-trigger" style="color: #337ab7;">Проверка_2</a>
</li>
</ul>
</div>
</div>
Подскажите, пожалуйста, как при нажатии на Проверка_1 загрузить страницу с одним текстом, а при нажатии Проверка_2 - с другим? То есть, чтобы не делать для каждого текста новую страницу (html).
Можно сделать 2 блока с текстом и по умолчанию скрыть их. При нажатии на Проверка_1 с помощью javascript нужно отобразить блок с текстом, и так же для второго блока.
$("#check_1").click(function(){
$("#text_1").toggleClass("hidden");
});
$("#check_2").click(function(){
$("#text_2").toggleClass("hidden");
});
.hidden {
opacity: 0;
}
.textbox {
width: 50px;
height: 50px;
border: 1px solid red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="panel panel-default">
<div class="panel-heading">Главная</div>
<div class="panel-body">
<ul>
<li><a id="check_1" data-toggle="collapse" class="spoiler-trigger" style="color: #337ab7;">Проверка_1</a>
</li>
<li><a id="check_2" data-toggle="collapse" class="spoiler-trigger" style="color: #337ab7;">Проверка_2</a>
</li>
</ul>
</div>
</div>
<div id="text_1" class="textbox hidden">text 1</div>
<div id="text_2" class="textbox hidden">text 2</div>
Продвижение своими сайтами как стратегия роста и независимости