单选按钮不会重置为初始值

Question

我有以下共享相同 name 的单选按钮：

<div id="main_div">
    <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="radio1">
        <input type="radio" id="radio1" class="mdl-radio__button" name="somename" value="1" checked>
        <span class="mdl-radio__label">Radio 1</span>
    </label>
    <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="radio2">
        <input type="radio" id="radio2" class="mdl-radio__button" name="somename" value="2">
        <span class="mdl-radio__label">Radio 2</span>
    </label>
    <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="radio3">
        <input type="radio" id="radio3" class="mdl-radio__button" name="somename" value="3">
        <span class="mdl-radio__label">Radio 3</span>
    </label>
    <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="radio4">
        <input type="radio" id="radio4" class="mdl-radio__button" name="somename" value="4">
        <span class="mdl-radio__label">Radio 4</span>
    </label>
    <label class="mdl-radio mdl-js-radio mdl-js-ripple-effect" for="radio5">
        <input type="radio" id="radio5" class="mdl-radio__button" name="somename" value="5">
        <span class="mdl-radio__label">Radio 5</span>
    </label>
</div>

我不能弄乱它，因为我需要更改页面然后返回。

例如，当我检查收音机 radio3 并使用 link 转到下一页，然后单击浏览器返回时。我的单选 radio3 按钮仍处于选中状态，但默认情况下我给 radio1 属性 checked 所以我认为应该选中 radio1。

我在 radio3 中的标签中看到了以下内容 class is-checked 但未检查输入。

我正在使用 material 精简版设计 (https://getmdl.io/)

Answer 1

您可以通过将 autocomplete="off" 添加到 <input> 元素来阻止浏览器“记住”单选按钮的状态。这应该使您的页面显示每次选中的第一个收音机。

<input type="radio" value="xxx" autocomplete="off">

单选按钮不会重置为初始值

Radio button doesn't reset to initial

html

css

radio

material-design-lite