選中單選按鈕時如何僅顯示兩個按鈕？

Question

我有一個實現 3 個按鈕的表單。 每個按鈕為 select 的用戶提供不同的選項。 該頁面僅呈現兩個按鈕，最后一個是隱藏的。 我想根據單選按鈕輸入更改顯示的內容。

這是我正在使用的 HTML 文檔：

 .hidden{ display: none; }

 <label for="pay">Payment Option</label> <div class="row check"> <div class="col-sm-6"> <input type="radio" id="gcash" name="pay" value="gcash" checked="checked"/> <label for="gcash" class="pay">Gcash</label> </div> <div class="col-sm-6"> <input type="radio" id="walk" name="pay" value="unpaid"/> <label for="walk" class="pay">Walk In</label> </div> </div> <div class="buttons"> <a href="#" class="res-btn" role="button">Back</a> <a href="#" class="res-btn" role="button">Proceed payment</a> <input type="submit" class="res-btn hidden" name="btn-submit" value="Submit"> </div>

Answer 1

 radio.addEventListener('change', function() { console.log(this.value) });

使用此處理程序獲取無線電數據

然后，找到你的元素並使用

element.classList.toggle("隱藏");

用於切換 class 名稱，用於您的 css