【问题标题】:why I can select multiple radio buttons in this form?为什么我可以在此表单中选择多个单选按钮?
【发布时间】:2019-02-24 15:15:04
【问题描述】:

我有两个表格

其中只有一个正在工作,可能是“示例 2”

两者在功能上几乎相同

“示例 1”是有问题的,“示例 2”工作正常。

 <h4>example 1<h4/>


<form class="answerFormClass" action="http://127.0.0.1:5000" method="PSOT" >

 <div name="choiceDivName_0" id="choiceDivId_0">
  <input type="radio" name="choice_radio_0" id="choiceId_radio_0" value="get">
  <label for="choiceId_radio_0">get</label>
</div>
<div name="choiceDivName_1" id="choiceDivId_1">
  <input type="radio" name="choice_radio_1" id="choiceId_radio_1" value="give">
  <label for="choiceId_radio_1">give</label>
</div>
<div name="choiceDivName_2" id="choiceDivId_2">
  <input type="radio" name="choice_radio_2" id="choiceId_radio_2" value="gone">
  <label for="choiceId_radio_2">gone</label>
</div>

  <input type="submit" name="submitBtnName" id="submitBtnid" value="CLick here"></button>
</form>

<h4>example 2<h4/>

<form action="/action_page.php">
  <label for="male">Male</label>
  <input type="radio" name="gender" id="male" value="male"><br>
  <label for="female">Female</label>
  <input type="radio" name="gender" id="female" value="female"><br>
  <label for="other">Other</label>
  <input type="radio" name="gender" id="other" value="other"><br><br>
  <input type="submit" value="Submit">
</form>

这里是codepen中的代码:https://codepen.io/anon/pen/zbOOMM?editors=1010

*“example 1”是由一个动态的java脚本“example 2”在网上找到的*

【问题讨论】:

  • 方法 = PSOT?让它发布。并为您的无线电字段提供相同的名称。
  • 另请注意,&lt;input ...&gt; 元素后面有一个杂散的&lt;/button&gt; 标记,可能是由于在某些时候将按钮从&lt;button&gt;...&lt;/button&gt; 转换为&lt;input type="button" ...&gt;...

标签: javascript html


【解决方案1】:

因为单选按钮是根据具有相同的name 的它们进行分组的,但是您的单选按钮都有不同的名称。要制作一组单选按钮,请将它们都赋予相同的name 属性。

(旁注:您通常不需要单选按钮元素上的id 属性,但如果您有,则不必与name 相同。)

这里他们使用相同的name

<h4>example 1<h4/>

<form class="answerFormClass" action="http://127.0.0.1:5000" method="PSOT" >

 <div name="choiceDivName_0" id="choiceDivId_0">
  <input type="radio" name="choice" id="choiceId_radio_0" value="get">
  <label for="choiceId_radio_0">get</label>
</div>
<div name="choiceDivName_1" id="choiceDivId_1">
  <input type="radio" name="choice" id="choiceId_radio_1" value="give">
  <label for="choiceId_radio_1">give</label>
</div>
<div name="choiceDivName_2" id="choiceDivId_2">
  <input type="radio" name="choice" id="choiceId_radio_2" value="gone">
  <label for="choiceId_radio_2">gone</label>
</div>

  <input type="submit" name="submitBtnName" id="submitBtnid" value="CLick here">
</form>

【讨论】:

  • 该死的你太快了TJ
猜你喜欢
  • 2018-09-22
  • 1970-01-01
  • 2016-07-07
  • 2014-10-18
  • 2021-04-09
  • 2023-03-24
  • 2011-03-12
  • 1970-01-01
相关资源
最近更新 更多