收音机选择上的页面位置重置[关闭]答案

【问题标题】：Page position reset on radio selection [closed]收音机选择上的页面位置重置[关闭]
【发布时间】：2026-02-07 22:05:01
【问题描述】：

为什么在这个jsfiddle中进行选择时页面位置会重置，我该如何防止它？

HTML：

<fieldset class="rating one">
  <input type="radio" id="star5" name="rating" value="5" /><label for="star5" title="Rocks!"><span>&#9733</span></label>
  <input type="radio" id="star4" name="rating" value="4" /><label for="star4" title="Pretty good"><span>&#9733</span></label>
  <input type="radio" id="star3" name="rating" value="3" /><label for="star3" title="Meh"><span>&#9733</span></label>
  <input type="radio" id="star2" name="rating" value="2" /><label for="star2" title="Kinda bad"><span>&#9733</span></label>
  <input type="radio" id="star1" name="rating" value="1" /><label for="star1" title="Sucks big time"><span>&#9733</span></label>
</fieldset>

正在发生的事情的马铃薯质量 GIF：

http://i.imgur.com/uEvn58U.gif

编辑：新的 jsfiddle 链接

【问题讨论】：

页面位置重置是什么意思？除了突出显示的星星之外，我没有看到小提琴中发生任何事情。
我不明白你想达到什么目的
@FiidoFirdauz 动画 gif 已添加。
我在 jsfiddle 中没有看到任何文字，请提供。
@FiidoFirdauz 添加了新的 jsfiddle 链接

标签： javascript html css

【解决方案1】：

我想出了如何解决它，但不知道为什么会发生（尽管我可以猜到它正在尝试使用“视图内”的单选按钮来定位自己）。

我更改了以下代码

.rating:not(:checked) > input {
  position:absolute;
  top:-9999px;
  clip:rect(0,0,0,0);
}

到

.rating:not(:checked) > input {
  position:absolute;
  visibility: hidden;
  clip:rect(0,0,0,0);
}

修复https://jsfiddle.net/t4t0dxqz/

Finally found a thread that clued me in

【讨论】：

aww 我几乎发布了那个答案。！ nvm好吧，你终于想通了：D