2015-10-10 257 views
1

问题我已经创建了两个单选按钮,使用没有JavaScript的引导程序。 当我试图查看并单击单选按钮时。我选择他们都引导多个单选按钮选择

这是我的html代码与单选按钮。我将不胜感激任何可以解决我的问题的建议。谢谢你们

<div class="col-md-2"> 
    <form role="form"> 
     <div class="table table-responsive"> 
      <table class="table"> 
       <tr class="active"> 
        <th> 
         <div class="radio"> 
         <label><input type="radio" name="one-way" >One way</label> 
         </div> 
        </th> 
        <th> 
         <div class="radio"> 
         <label><input type="radio" name="roundtrip">Roundtrip</label> 
         </div> 
        </th> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         <label for="start-location">From (Any City or Airport)</label> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         <select class="form-control" id="start-location"> 
          <option class="default"></option> 
          <option>Manila</option> 
          <option>Cebu</option> 
          <option>Cagayan</option> 
          <option>Davao</option> 
          <option>General Santos</option> 
         </select> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         <label for="target-location">To (Any City or Airport)</label> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2"> 
         <select class="form-control" id="target-location"> 
          <option class="default"></option> 
          <option>Manila</option> 
          <option>Cebu</option> 
          <option>Cagayan</option> 
          <option>Davao</option> 
          <option>General Santos</option> 
         </select> 
        </td> 
       </tr> 
      </table> 
     </div> 
    </form> 
</div> 

图片是在这里: enter image description here

+1

具有相同名称的单选按钮被视为一个组。名称是不同的,所以你可以选择 –

+0

哦,我现在得到它。谢谢 –

回答

1

如果单选按钮确实代表一种选择,你想只有两个中的一个被选中,你必须给他们喜欢同一个名字:

<div class="col-md-2"> 
    <form role="form"> 
    <div class="table table-responsive"> 
    <table class="table"> 
    <tr class="active"> 
     <th> 
     <div class="radio"> 
      <label> 
      <input type="radio" name="roundtrip">One way</label> 
     </div> 
     </th> 
     <th> 
     <div class="radio"> 
      <label> 
      <input type="radio" name="roundtrip">Roundtrip</label> 
     </div> 
     </th> 
    </tr> 
    <tr> 
     <td colspan="2"> 
     <label for="start-location">From (Any City or Airport)</label> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="2"> 
     <select class="form-control" id="start-location"> 
      <option class="default"></option> 
      <option>Manila</option> 
      <option>Cebu</option> 
      <option>Cagayan</option> 
      <option>Davao</option> 
      <option>General Santos</option> 
     </select> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="2"> 
     <label for="target-location">To (Any City or Airport)</label> 
     </td> 
    </tr> 
    <tr> 
     <td colspan="2"> 
     <select class="form-control" id="target-location"> 
      <option class="default"></option> 
      <option>Manila</option> 
      <option>Cebu</option> 
      <option>Cagayan</option> 
      <option>Davao</option> 
      <option>General Santos</option> 
     </select> 
     </td> 
    </tr> 
    </table> 
</div> 

这应该解决您的问题。

注意单选按钮名称的更改