Bootstrap單選按鈕：在提交表單上獲取選定的值

Question

我有下一個boostrap單選按鈕：

<div class="btn-group" id="filterDay" data-toggle="buttons">
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="1">Monday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="2"> Tuesday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="3"> Wednesday
       </label>
       <label class="btn btn-default blue">
         <input type="radio" class="toggle" value="4"> Thursday
       </label>
       <label class="btn btn-default blue">
          <input type="radio" class="toggle" value="5"> Friday
       </label>
       <label class="btn btn-default blue">
           <input type="radio" class="toggle" value="6"> Saturday
        </label>
       <label class="btn btn-default blue active">
           <input type="radio" class="toggle" value="0"> Sunday
       </label>
</div>

我在提交表單時嘗試獲取活動按鈕的值，而不創建“onclick”事件，只需從$（'＃filterDay'）按鈕組獲取活動按鈕。 應該很容易，但我找不到獲得價值的方法。 我嘗試了幾個例子但是有效。

有人可以幫忙嗎？

謝謝！

更新：

這是html“打印”代碼：

<label class="btn btn-default blue">
   <input type="radio" class="toggle" value="6"> Saturday
</label>    
<label class="btn btn-default blue active">
        <input type="radio" class="toggle" value="0"> Sunday
</label>

當我點擊按鈕時，班級中的“活動”就會發生變化。

Answer 1

在表單提交處理程序中使用：checked選擇器

var filterDay = $('#filterDay input:radio:checked').val()

Answer 2

試試這個，它應該解決你的問題。

$( "input:checked" ).val()

您可以參考以下鏈接了解更多詳情：
http://api.jquery.com/checked-selector/

Answer 3

您應該設置一個通用的“名稱”來標識表單：

<div class="btn-group" id="filterDay" data-toggle="buttons">
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="1">Monday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="2"> Tuesday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="3"> Wednesday
   </label>
   <label class="btn btn-default blue">
     <input type="radio" class="toggle" name="toggle" value="4"> Thursday
   </label>
   <label class="btn btn-default blue">
      <input type="radio" class="toggle" name="toggle" value="5"> Friday
   </label>
   <label class="btn btn-default blue">
       <input type="radio" class="toggle" name="toggle" value="6"> Saturday
    </label>
   <label class="btn btn-default blue active">
       <input type="radio" class="toggle" name="toggle" value="0"> Sunday
   </label>
</div>

要獲得價值，您可以這樣：

$('input[name=toggle]:checked').val()

Answer 4

代碼中的一些邏輯問題......

<label class="btn btn-default blue active">
       <input type="radio" class="toggle" value="0"> Sunday
</label>

Label具有活動類，因此bootstrap會將其顯示為活動狀態，但不會檢查包含的輸入無線電，​​因此在純html中不會檢查它。

正確的代碼......

<label class="btn btn-default blue active">
       <input type="radio" checked="checked" class="toggle" value="0"> Sunday
</label>

Answer 5

使用jquery：選中選擇器鏈接

Answer 6

$('#radioButtonName').prop('checked')

這適用於