僅當所有問題中的單選按鈕都被選中時才啟用提交按鈕jquery-有解無憂

我有一個簡單的 html 表單，其中有 50 個問題，所有問題都有自己的單選按鈕選項，如下所示：

<h3 class="text-danger">1. Question 1</h3>
<input class="form-check-input" value="1" type="radio" name="q1" id="flexRadioDefault1">
<label class="form-check-label" for="flexRadioDefault1">
    Option 1
    </label>
<input class="form-check-input" type="radio" value="2" name="q1" id="flexRadioDefault1">
<label class="form-check-label" for="flexRadioDefault1">
        Option 2  </label>



<h3 class="text-danger">2. Question 2</h3>
<input class="form-check-input" value="1" type="radio" name="q1" id="flexRadioDefault1">
<label class="form-check-label" for="flexRadioDefault1">
    Option 1
    </label>
<input class="form-check-input" type="radio" value="2" name="q1" id="flexRadioDefault1">
<label class="form-check-label" for="flexRadioDefault1">
        Option 2  </label>

我希望用戶完成所有問題，并且只在完成后提交，我做了如下的事情：

$(function(){
    $("input[type='radio']").change(function(){
        $("input[type='submit']").prop("disabled", false);
    });
});

<input type="submit" disabled="disabled"/>

但這并不準確，因為如果用戶完成 1 個問題，提交按鈕會啟用，誰能告訴我如何完成此操作，在此先感謝

uj5u.com熱心網友回復：

通過選擇其中一個單選按鈕使其變得簡單

你的代碼看起來像

<h3 class="text-danger">1. Question 1</h3>
<input class="form-check-input" value="1" type="radio" name="q1" id="flexRadioDefault11" checked>
<label class="form-check-label" for="flexRadioDefault11">Option 1</label>
<input class="form-check-input" type="radio" value="2" name="q1" id="flexRadioDefaultq12">
<label class="form-check-label" for="flexRadioDefaultq12">Option 2  </label>


<h3 class="text-danger">2. Question 2</h3>
<input class="form-check-input" value="1" type="radio" name="q2" id="flexRadioDefaultq21" checked>
<label class="form-check-label" for="flexRadioDefaultq21">  Option 1 </label>
<input class="form-check-input" type="radio" value="2" name="q2" id="flexRadioDefaultq22">
<label class="form-check-label" for="flexRadioDefaultq22"> Option 2  </label>

uj5u.com熱心網友回復：

$("#btn").on("click", function (e) {
  e.preventDefault;
  $(".radio").each(function (index) {
    if (!$(this).is(":checked")) {
      alert(index   "is uncheck");
    }
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type="radio" class="radio" />
<input type="radio" class="radio" />
<input type="radio" class="radio" />
<input type="radio" class="radio" />
<input type="radio" class="radio" />

<button id="btn">submit</button>

你需要你.each() 的方法。

uj5u.com熱心網友回復：

塊參考

1. 問題 1 選項 1 選項 2 2. 問題 2 選項 1 選項 2

轉載請註明出處，本文鏈接：https://www.uj5u.com/net/478718.html

標籤：javascript html jQuery 按钮单选按钮

上一篇：通過陣列映射以生成物件

下一篇：如何將物件屬性值分配為同一物件中的鍵？