问题:

当点击标签时(对于通过将其定位在屏幕外而故意隐藏的单选按钮),浏览器会不期望地跳到页面顶部.

注意:这个问题在不同的浏览器中是不一致的 - 它出现在safari和chrome中,并且它不会出现在firefox或opera中

题:

单击单选按钮的标签时,如何防止浏览器将滚动条跳到页面顶部？

示例代码:

• JS小提琴

•HTML

<div class="rdbut">
    <label class="colour">
        <input id="option-AVGANT1Y2PC" type="radio" name="Multi-licence" value="1 Year 2 PC|+23.99|0" checked="checked" />
        <span>£24.99</span></label>
</div>
<div class="rdbut">
    <label class="colour">
        <input id="option-AVGANT2Y2PC" type="radio" name="Multi-licence" value="2 Year 2 PC|+34.00|0" checked="checked" />
        <span>£35.00</span></label>
</div>

•CSS

.rdbut {
    margin: 0px;
}

.rdbut label {
    float: left;
    width: 65px;
    margin: 4px;
    background-color: #EFEFEF;
    box-shadow: 0px 1px 3px rgba(50, 50, 50, 0.25);
    border: none;
    overflow: auto;
    display: inline;
}

.rdbut label span {
    text-align: …