Сохранение выделения input type="radio" после обновления страницы
Доброе время суток.
Сделал меню из input type="radio" + css в виде вкладок под которыми ссылки на категории с товаром, но если выбираю вторую вкладку, потом там жму на любую ссылку, то идет переход и выделение второй вкладки снимается и перебрасывается на первую. Использую cms prestashop, там все на модулях, знания на уровне ctrl+c, ctrl+v ну чуть больше. Находил много решений, но не догоняю как их подключить. Может кто поделится кодом, который можно просто вставить на ту же страницу с моим меню или предложит альтернативу. Готов даже заплатить 10$ веб- мани или через банковское отправление, деньги маленькие, но я пока не могу себе позволить больше тратить. Прошу понять и простить __________________________________ |Аккумуляторы| Кулера | Клавиатуры | --------------------------------------------------------------------- | asus dell lenovo acer apple samsung | ---------------------------------------------------------------------
<div class="tabs">
<div class="tab">
<input type="radio" id="tab-1" name="tab-group-1" checked>
<label for="tab-1"><strong>Аккумуляторы</strong></label>
<div class="content">
<p class="sod" ><a href="#">Apple</a></p>
<p class="sod" ><a href="#">Apple2</a></p>
<p class="sod" ><a href="#">Apple3</a></p>
</div>
</div>
<div class="tab">
<input type="radio" id="tab-2" name="tab-group-1">
<label for="tab-2"><strong>Кулера</strong></label>
<div class="content">
<p class="sod"><a href="#">dell</a> </p>
<p class="sod" ><a href="#">dell2</a></p>
<p class="sod" ><a href="#">dell3</a></p>
</div>
</div>
<div class="tab">
<input type="radio" id="tab-3" name="tab-group-1">
<label for="tab-3"><strong>Клавиатуры</strong></label>
<div class="content">
<p class="sod"><a href="#">ACER</p>
<p class="sod"><a href="#">ACER3</p>
<p class="sod"><a href="#">ACER</p>
</div>
</div>
|
:write:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div class="tabs">
<div class="tab">
<input type="radio" id="tab-1" name="tab-group-1" checked>
<label for="tab-1"><strong>Аккумуляторы</strong></label>
<div class="content">
<p class="sod" ><a href="#">Apple</a></p>
<p class="sod" ><a href="#">Apple2</a></p>
<p class="sod" ><a href="#">Apple3</a></p>
</div>
</div>
<div class="tab">
<input type="radio" id="tab-2" name="tab-group-1">
<label for="tab-2"><strong>Кулера</strong></label>
<div class="content">
<p class="sod"><a href="#">dell</a> </p>
<p class="sod" ><a href="#">dell2</a></p>
<p class="sod" ><a href="#">dell3</a></p>
</div>
</div>
<div class="tab">
<input type="radio" id="tab-3" name="tab-group-1" >
<label for="tab-3"><strong>Клавиатуры</strong></label>
<div class="content">
<p class="sod"><a href="#">ACER</a></p>
<p class="sod"><a href="#">ACER2</a></p>
<p class="sod"><a href="#">ACER3</a></p>
</div>
</div>
</div>
<script>
var id = localStorage.checked;
if(id) document.getElementById(id).checked = true
var input = document.getElementsByName('tab-group-1');
for (var i=0; i<input.length; i++) {
input[i].onclick = function() {
localStorage.checked = this.id ;
} }
</script>
</body>
</html>
|
Все работает оставьте свои реквизиты куда деньги перевести
спасибо!!!!!! |
| Часовой пояс GMT +3, время: 17:22. |