Php Javascript: выбор радиокнопок при обновлении страницы

У меня есть адаптивные css-вкладки, которые я использую для элегантного отображения информации, но когда пользователь обновляет страницу, он возвращается к первому проверенному вводу. Я хотел бы знать, как сохранить выбранную пользователем кнопку на странице обновления той, которую он ранее выбрал. Я написал сценарий, но он не работает.

вкладки

  <input class="inputabs" id="tab1" type="radio" name="tabs" checked="checked">
<label class="labeltabs" for="tab1">Inbox</label>

<input class="inputabs" id="tab2" type="radio" name="tabs" >
<label class="labeltabs"for="tab2">Important</label>

<input class="inputabs" id="tab3" type="radio" name="tabs">
<label class="labeltabs" for="tab3">Bin</label>

скрипт

<script>
$(document).ready(function(){
$('.inputabs input[type="radio"]').each(function(){
$(this).attr("checked",$(this).checked());
}
);
</script>

4

Решение

Будет ли работать следующее для вас требование:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
if(localStorage.selected) {
$('#' + localStorage.selected ).attr('checked', true);
}
$('.inputabs').click(function(){
localStorage.setItem("selected", this.id);
});
});

</script>
</head>
<body>
<input class="inputabs" id="tab1" type="radio" name="tabs" checked="checked">
<label class="labeltabs" for="tab1">Inbox</label>

<input class="inputabs" id="tab2" type="radio" name="tabs" >
<label class="labeltabs"for="tab2">Important</label>

<input class="inputabs" id="tab3" type="radio" name="tabs">
<label class="labeltabs" for="tab3">Bin</label>
</body>
</html>
10

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector