Question

一个月前我问了这个问题：I'm trying to put a <button> inside an <input type="radio">'s <label>

我标记为正确的答案非常适合...对于我测试的桌面浏览器。在我的iPhone 6上进行测试，无论是Safari还是Chrome浏览器，其按钮均不可点击。

正确的答案片段复制如下：

what-app

button {
  pointer-events:none;
}

是否存在适用于智能手机和台式机的解决方案？

我可以摆脱<h1>Choose A or B</h1> <input type="radio" name="choice" value="A" id="a"><label for="a"><button type="button">A</button></label> <input type="radio" name="choice" value="B" id="b"><label for="b"><button type="button">B</button></label>并从头开始用JavaScript重写单选按钮的行为，但是我希望我不需要这样做。有没有更简单的方法？

Answer 1

<h1>Choose A or B</h1>
<label>
<input type="radio" name="mode" value="create">
<span style="-webkit-appearance: button;">create table</span>
</label>

<label>
<input type="radio" name="mode" value="create">
<span style="-webkit-appearance: button;">create field</span>
</label>

我正在尝试将<button>放在<input type =“ radio”>的<label>中以用于移动设备

1 个答案: