html - 两个单选按钮有条件地共享一个 “id”？

Question

我正在尝试为移动设备和桌面设备上的页面采用不同的设计。为此，需要为移动界面重新设计 3 个单选按钮 block 和一些其他内容，但在同一页面。

因此，我担心的是 2 个 block 是否可以共享一个 ID，因为我根据媒体查询隐藏和显示。

例子:

block 1

<div class="visible-xs">
   <input type="radio" name="yellow" id="yellow-color" value="14" 
   class="yellow radio-custom" checked="checked" />
   <input type="radio" name="red" id="red-color" value="52" 
   class="red radio-custom" />
</div>

区 block 2

<div class="hidden-xs">
   <input type="radio" name="yellow" id="yellow-color" value="14" 
   class="yellow radio-custom1" checked="checked" />
   <input type="radio" name="red" id="red-color" value="52" 
   class="red radio-custom1" />
</div>

它在功能方面是可行的，但问题是未检查移动页面上的 radio

Answer 1

要对 radio 输入进行分组，他们必须使用相同的name 属性并自动检查其中一个，只有 one same-name- 的 radio 输入group 必须具有 checked="checked" 属性。

如果有两个或多个具有该属性，则默认情况下不会选择任何一个。