Javascript 触发单击单选按钮并记住页面刷新时的选择

这个问题没有重复

我有两个单选按钮（收音机1，收音机2）

我能够分别实现以下目标：

在页面加载时触发单击“radio1”。因此，无论何时加载页面，都会单击按钮

记住用户使用Joseph Silber在中描述的本地存储手动单击的所选单选按钮。因此，如果用户手动单击“radio2”，然后刷新页面，它会记住该选择

问题是我不能同时使用这两种方法。因为触发的点击总是占据本地存储，这使得页面刷新时不会记住选中的单选按钮

默认情况下，我需要在页面加载时单击“radio1”（未选中），但当用户手动单击“radio2”时，它会记住该选择，并且每当页面刷新时，将根据用户的选择单击“radio2”

我尝试了很多组合代码，我必须让它们一起工作，但我想不出来

页面加载时触发单击单选按钮的代码：

<script type="text/javascript">
$(document).ready(function() {
  $("#radio1 input:radio").click(function() {
    alert("clicked");
   });
  $("input:radio:first").prop("checked", true).trigger("click");
});
</script>

<script type="text/javascript">
$(function()
{
    $('input[type=radio]').each(function()
    {
        var state = JSON.parse( localStorage.getItem('radio_'  + this.id) );

        if (state) this.checked = state.checked;
    });
});

$(window).bind('unload', function()
{
    $('input[type=radio]').each(function()
    {
        localStorage.setItem(
            'radio_' + this.id, JSON.stringify({checked: this.checked})
        );
    });
});
</script>

$（文档）.ready（函数（）{
$（“#radio1输入：radio”）。单击（函数（）{
警报（“点击”）；
});
$（“输入：radio:first”）.prop（“选中”，true）。触发器（“单击”）；
});

本地存储的代码；记住收音机选择：

<script type="text/javascript">
$(document).ready(function() {
  $("#radio1 input:radio").click(function() {
    alert("clicked");
   });
  $("input:radio:first").prop("checked", true).trigger("click");
});
</script>

<script type="text/javascript">
$(function()
{
    $('input[type=radio]').each(function()
    {
        var state = JSON.parse( localStorage.getItem('radio_'  + this.id) );

        if (state) this.checked = state.checked;
    });
});

$(window).bind('unload', function()
{
    $('input[type=radio]').each(function()
    {
        localStorage.setItem(
            'radio_' + this.id, JSON.stringify({checked: this.checked})
        );
    });
});
</script>

$（函数（）
{
$（'input[type=radio]'）。每个（函数（）
{
var state=JSON.parse（localStorage.getItem（'radio_'+this.id））；
如果（state）this.checked=state.checked；
});
});
$（窗口）.bind（'unload'，function（）
{
$（'input[type=radio]'）。每个（函数（）
{
localStorage.setItem(
'radio_'+this.id，JSON.stringify（{checked:this.checked}）
);
});
});

同样，它们都可以很好地工作，但分开来看，它们中的任何一个都可以工作

---

如果有人能帮助我使这两种方法协同工作，我将不胜感激。

为什么不设置默认无线电

：选中
属性，但
。触发器（'click'）



或者，如果您需要在DOM ready上为默认无线电触发事件处理程序（就像您在代码中使用
.trigger（'click'）
），请使用以下命令：

$(function(){
    //state default radio ':checked' property there and run its `click` event handler:
    radioClick.call($("input:radio:first").prop("checked", true));

    $("#radio1 input:radio").click(radioClick);

    // method triggered on radio click, will skip the localStorage modification:
    function radioClick() {
        // you can refer here to 'this' as to clicked radio
        alert($(this).val());
    }

    // overwrite radio ':checked' property there (if exists in localStorage) :
    $('input[type=radio]').each(function(){
        var state = JSON.parse( localStorage.getItem('radio_'  + this.id) );

        if (state) this.checked = state.checked;
    });
});

$(window).bind('unload', function(){
    $('input[type=radio]').each(function(){
        localStorage.setItem(
            'radio_' + this.id, JSON.stringify({checked: this.checked})
        );
    });
});



或者，甚至更好的是，在HTML中设置默认的radio
checked
属性权限：

<input type=radio id=radio1 value=radio1 name=radio checked />
<input type=radio id=radio2 value=radio2 name=radio />
<input type=radio id=radio3 value=radio3 name=radio />
...

谢谢您的回答！我需要它被点击，因为有嵌套的项目将不会显示，除非单选按钮被点击，而不仅仅是选中。我看到你评论说“如果本地存储存在，覆盖无线电”，这就是我要找的！但如果本地存储存在，我需要覆盖并单击。所以，如果“radio2”存在于本地存储器中，它会触发对它的点击。我试图附加此部分
.trigger（“单击”）到本地存储的代码，但它不起作用。我希望你能帮我做这部分。非常感谢。@JFallz，看看我答案的编辑部分。这就是你需要实现的吗？是的！！非常感谢你！你真棒。我现在要把它标记为已接受的答案。感谢您的百忙之中！：）@阿图尔Filipiak@JFallz，很高兴我能帮忙！：）