javascript - 我正在尝试放置一个在一个里面用于手机

Question

一个月前我问了这个问题：我正在尝试将 <button> 放入 <input type="radio"> 的 <label>

我标记为正确的答案非常有效......对于我测试的桌面浏览器。在我的 iPhone 6 上进行测试，Safari 和 Chrome 的按钮都无法点击。

正确答案片段复制如下：

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>

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

我可以从头开始摆脱<input type=“radio”&gt;和重写 JavaScript 中的单选按钮行为，但我希望我不需要这样做。有没有更简单的方法？

标签： javascripthtmlmobile

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>