Javascript localStorage不保存更改的单选按钮值，如果；勾选“；使用

试图用多种方法解决这个问题。1.只需将普通html“checked”默认选项添加到我的表单和2中的单选按钮。让js函数来做，这是尝试过的想法的要点

问题：我发现，无论我如何操作，如果收音机在默认情况下被指定为选中（在用户做出选择之前），那么在这之后所做的任何事情都不会正确地保存在localStorage中（如果有的话）。localStorage将保存初始的默认选择，但是，从那时起不能更改任何内容（即使在“物理”选择另一个选项之后）

我知道localStorage正在工作，因为如果我不使用默认名称（对于其余的输入），它就可以正常工作

表格编号：

<label>Who is the contact person for this event?<span class="requiredtext">*</span></label>
<input type="radio" name="Contact_Person" id="Contact_Person1" value="Submitter is the contact person" onclick="contacthide()" checked required>&nbsp;I am<br />
<input type="radio" name="Contact_Person" id="Contact_Person2" value="Submitter is not the contact person" onclick="contactshow()" required>

如果用户在最终提交前返回进行更改，则会将其吐出的代码：

    $(document).ready(function() {
        if (Modernizr.localstorage) {
            //Browser supports it
            if (localStorage.getItem("flag") == "set") {

$('input[type=radio]').each(function() {
                    var state = JSON.parse(localStorage.getItem('radio_' + $(this).attr('id')));
                    if (state) this.checked = state.checked;
                });

除此之外，我还有一个确认页面，它获取了localStorage中存储的所有变量，并在用户点击submit之前将它们呈现给用户进行最终检查

它包括：

var ContactPerson=localStorage.getItem（'Contact_Person'）文档。编写一个吐出html和变量值的
。同样，如果我不尝试设置默认的收音机选项，这很好（对于所有其他输入类型都很好）

理想的结果是在默认情况下选择最有可能的单选按钮选项，这样可以节省用户时间。我不想让他们看到一个表格，如果我能在手前“为他们做出决定”，他们就必须亲自点击每个单选按钮

希望这一切都有意义
 我知道这是一个老问题，但我一直在排除类似问题的故障，并想与大家分享我的解决方案

当您设置localStorage项时，您正在保存无线电输入及其值，b/c使用ID属性作为键

localStorage.setItem('radio_' + $(this).attr('id'), JSON.stringify({ checked: this.checked }));

这可能没问题，但我采取了不同的方法。而且，我可能遗漏了什么，所以欢迎评论

相反，我使用
$（this）.attr（'name'）
来设置键。因此，当选择中的任一单选按钮时，您正在将该值保存到同一本地存储密钥

在我的场景中，我将许多输入存储到localStorage，因此我的解决方案有点抽象。我在每个输入上使用jQuery的.change（）方法调用saveToLocalStorage（）。此外，我还将输入值直接保存到localStorage

function saveToLocalStorage(input) {
  if ( $(input).attr('type')=='radio' ) {
    localStorage[$(input).attr('name')] = $(input).val();
  } else {
    localStorage[$(input).attr('id')] = $(input).val();
  }
}

从localStorage检索时，我必须在选择localStorage key:value对之前检查它是否与无线电输入匹配。否则，我选择了两个无线电输入。注意，在我的场景中，我使用的是jQuery 1.4.4，因此使用attr（'checked'，'checked'）

不必等待
窗口卸载
事件，您可以尝试在表单更新时更新本地存储（通过
输入onlick
事件等）。
function saveToLocalStorage(input) {
  if ( $(input).attr('type')=='radio' ) {
    localStorage[$(input).attr('name')] = $(input).val();
  } else {
    localStorage[$(input).attr('id')] = $(input).val();
  }
}

$('input[type=radio]').each(function() {
  var key = $(this).attr('name');
  var val = localStorage[key];
  if ( $(this).attr('name') == key && $(this).attr('value') == val ) {
    $(this).attr('checked', 'checked');
  }
});