在我的代码中,我有两行内联单选按钮,每当我单击一个单选按钮时,这两行就好像它们属于同一组一样
所以每一行都无法有自己的选择这里是我的代码:
<p class="text-danger" style="font-size: 20px;margin: 20px 0 10px 0;">Select Your Ad size :</p>
<div class="row">
<div class="col-xs-12" id="ad_size">
<span class="disp_ad_size disp_active">
<label class="radio-inline">
<input type="radio" onClick="ad_size(this)" name="inlineRadioOptions" id="size_ad_1" value="size_ad_1" checked><span style="font-size: 15px;font-weight: bold;">4cm x 4cm</span>
</label>
</span>
<span class="disp_ad_size">
<label class="radio-inline">
<input type="radio" onClick="ad_size(this)" name="inlineRadioOptions" id="size_ad_2" value="size_ad_2"><span style="font-size: 15px;font-weight: bold;">8cm x 6cm</span>
</label>
</span>
<span class="disp_ad_size">
<label class="radio-inline">
<input type="radio" onClick="ad_size(this)" name="inlineRadioOptions" id="size_ad_3" value="size_ad_3"><span style="font-size: 15px;font-weight: bold;">33cm x 25cm</span>
</label>
</span>
<span class="disp_ad_size">
<label class="radio-inline">
<input type="radio" onClick="ad_size(this)" name="inlineRadioOptions" id="size_ad_4" value="size_ad_4"><span style="font-size: 15px;font-weight: bold;">33cm x 52cm</span>
</label>
</span>
</div>
</div>
<p class="text-danger" style="font-size: 20px;margin: 20px 0 10px 0;">Select Your Ad Position :</p>
<div class="row">
<div class="col-xs-12" id="ad_pos">
<span class="disp_ad_pos disp_active">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptions" id="size_pos_any" value="size_ad_1" checked><span style="font-size: 15px;font-weight: bold;">Any page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptions" id="size_pos_5" value="size_ad_2"><span style="font-size: 15px;font-weight: bold;">3rd page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptions" id="size_pos_3" value="size_ad_3"><span style="font-size: 15px;font-weight: bold;">5th page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptions" id="size_pos_last" value="size_ad_4"><span style="font-size: 15px;font-weight: bold;">Last page</span>
</label>
</span>
<span class="disp_ad_pos" style="margin-right:0px">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptions" id="size_pos_front" value="size_ad_4"><span style="font-size: 15px;font-weight: bold;">Front Page</span>
</label>
</span>
</div>
</div>
所以我有两个 div“ad_size”和“ad_pos”,所以在 ad_size 中选择一个单选按钮会更改另一个 div 中的单选按钮。
谁能指出我的错误
最佳答案
输入的名称应该不同;请更改广告位置中所有 radio 的名称,如下代码
<span class="disp_ad_pos disp_active">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptionsPage" id="size_pos_any" value="size_ad_1" checked><span style="font-size: 15px;font-weight: bold;">Any page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptionsPage" id="size_pos_5" value="size_ad_2"><span style="font-size: 15px;font-weight: bold;">3rd page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptionsPage" id="size_pos_3" value="size_ad_3"><span style="font-size: 15px;font-weight: bold;">5th page</span>
</label>
</span>
<span class="disp_ad_pos">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptionsPage" id="size_pos_last" value="size_ad_4"><span style="font-size: 15px;font-weight: bold;">Last page</span>
</label>
</span>
<span class="disp_ad_pos" style="margin-right:0px">
<label class="radio-inline">
<input type="radio" onClick="ad_pos(this)" name="inlineRadioOptionsPage" id="size_pos_front" value="size_ad_4"><span style="font-size: 15px;font-weight: bold;">Front Page</span>
</label>
</span>
关于html - "radio-inline"类不允许多组单选按钮工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39943825/