为什么选择两个单选按钮？

Question

按照给定的HTML，它虽然具有为模式

<div class="row margin-top"> 
    <div class="col-md-3 col-md-offset-1"> 
     <form action="" method="post"> 
      <div class="form-group"> 
       <label> 
        <input type="radio" value="keyword" name="mode"> 
        Search by Keyword 
       </label> 
      </div> 
     </form> 
    </div> 
    <div class="col-md-5"> 
     <form action="" method="post"> 
      <div class="form-group"> 
       <input type="text" name="keyword" class="form-control"> 
      </div> 
     </form> 
    </div> 
</div> 
<div class="row margin-top"> 
    <div class="col-md-11 col-md-offset-1"> 
     <form action="" method="post"> 
      <div class="form-group"> 
       <label> 
        <input type="radio" value="criteria" name="mode"> 
        Search by Criteria 
       </label> 
      </div> 
     </form> 
    </div> 
</div> 

Answer 1

这是因为，无论是在不同的<form>小号同名选择这两个收音机。您需要将它们放在一个<form>中。请将它们放入单一的<form>以获得预期的行为。

多个表单可以具有相同的选项。例如，可以使用Yes和No选项。

<div> 
 
    <form action=""> 
 
    <p>Do you have Item 1?</p> 
 
    <label><input type="radio" name="has"> Yes</label> 
 
    <label><input type="radio" name="has"> No</label> 
 
    </form> 
 
</div> 
 
<div> 
 
    <form action=""> 
 
    <p>Do you have Item 2?</p> 
 
    <label><input type="radio" name="has"> Yes</label> 
 
    <label><input type="radio" name="has"> No</label> 
 
    </form> 
 
</div> 
 
<div> 
 
    <form action=""> 
 
    <p>Do you have Item 3?</p> 
 
    <label><input type="radio" name="has"> Yes</label> 
 
    <label><input type="radio" name="has"> No</label> 
 
    </form> 
 
</div> 
 
<div> 
 
    <form action=""> 
 
    <p>Do you have Item 4?</p> 
 
    <label><input type="radio" name="has"> Yes</label> 
 
    <label><input type="radio" name="has"> No</label> 
 
    </form> 
 
</div> 
 
<div> 
 
    <form action=""> 
 
    <p>Do you have Item 5?</p> 
 
    <label><input type="radio" name="has"> Yes</label> 
 
    <label><input type="radio" name="has"> No</label> 
 
    </form> 
 
</div>

Answer 2

因为你在3种不同形式使用单选按钮。 尝试以单一形式提供

Answer 3

你想在那里实现什么？这不是很清楚。 您对每个元素都使用表单，而不是将所有元素的表单放在一起。

对于所有无线电元素，您都有相同的名称，这意味着您在提交表单（发布数据）时只会获得1个值。 你应该给不同的名字和不同的id以便添加javascript交互性。