移动端紧挨的<label>会出问题？

Question

<div class="col-xs-12">
    <label class="inpbox">
        <input type="radio" value="在婚" name="submit_data[5]" > 在婚 </label>
    <label class="inpbox">
        <input type="radio" value="同居" name="submit_data[5]" > 同居 </label>
    <label class="inpbox">
        <input type="radio" value="离异或丧偶" name="submit_data[5]" > 离异 </label>
    <label class="inpbox">
        <input type="radio" value="未婚" name="submit_data[5]" > 未婚 </label>
</div>

为什么如上的代码点击任何label都是选中第一个input？移动端好坑啊

Answer 1

老哥我也是碰到了，解决到了吗。
我的label是幕罩里的标签。幕罩>ul>li>label>input。平时用display:none。触发后变为block
我是给label绑定tap事件。在pc端上用谷歌测试有时候会出现单选框被选中，label的点击事件失灵。在手机上测试更邪。当我点击按钮打开幕罩后，按钮的水平方向的单选框会被自动选中，并且不触发label的事件。另外一个和pc端类似，就是被选中后，还是不触发label的事件，不过比起PC端测试，移动端更加频繁出现该bug