PHP的Javascript：保持在页面刷新页面上选择单选按钮

我有响应的css选项卡我用来以优雅的方式显示信息，但是当用户刷新页面时，它会返回到第一个选中的输入。我想知道如何保持页面上选择的用户按钮刷新他以前选择的用户按钮。我写了一个脚本，但它似乎没有工作。PHP的Javascript：保持在页面刷新页面上选择单选按钮

标签

<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>

来源

2017-02-20 Sebastian Farham

你将不得不在页面刷新或使用传递信息某种类型的存储明智的时候，页面通过JavaScript重新加载任何更改将丢失。 – NewToJS

@NewToJS：你介意以身作则吗？ '：-D' –

会为你的要求了以下工作：

<!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>

来源

2017-02-20 03:06:36 uautkarsh

正确答案。请选择此解决方案，以便它可以帮助未来的用户。仅供参考，查看存储在本地存储中的数据，在chrome中 - >按F12 - >单击应用程序 - >在导航栏中选择本地存储。你会发现键和值为“selected”和“tab2”，这有助于存储用户输入的值。 – Venky

PHP的Javascript：保持在页面刷新页面上选择单选按钮

回答

相关问题