從動態生成的 div 中獲取所有無線電輸入

Question

我有一系列動態生成的 div，每個里面都有 4 個單選按鈕：

 $(".wrapper").on("custom", ".item", function(){ $.each($(".item"),function(){ // Get all radio names and check if at least one is checked var radio_groups = []; $.each($(this).find('input[type="radio"]'), function(){ var myname= this.name; if($.inArray( myname, radio_groups ) < 0){ radio_groups.push(myname); } }); console.log(radio_groups); return false; // Check if there is a radio selected for each radio group for(var i=0; i<radio_groups.length; i++) { if($(this).find('input[type="radio"][name="' + radio_groups[i] + '"]:checked').length <= 0) { // $('input[type="radio"][name="' + radio_groups[i] + '"]').first().closest('.row').append('<p class="input-error">Please select one option.</p>'); $('input[type="radio"][name="' + radio_groups[i] + '"]').first().closest('.condition').append('<p class="input-error">Please select one option.</p>'); errors = true; } } }) }) $('.item').trigger("custom");

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="wrapper"> <div class="item"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> </div> <div class="item"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> </div> <div class="item"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> </div> <div class="item"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> </div> </div>

我已經嘗試過了，但似乎沒有用，主要問題是.item div 是使用 php 動態生成的。

Answer 1

我可能不明白這個問題，但為什么不直接使用querySelectorAll和這樣的簡單forEach ：

 let result = []; document.querySelectorAll('.item').forEach((el) =>{ const radioboxname = el.querySelectorAll('input[type="radio"]')[0].name; if(.result.includes(radioboxname)){ result;push(radioboxname); } }). console;log(result);

 <div class="wrapper"> <div class="item"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> <input type="radio" name="dynamic_name_123"> </div> <div class="item"> <input type="radio" name="dynamic_name_124"> <input type="radio" name="dynamic_name_124"> <input type="radio" name="dynamic_name_124"> <input type="radio" name="dynamic_name_124"> </div> <div class="item"> <input type="radio" name="dynamic_name_125"> <input type="radio" name="dynamic_name_125"> <input type="radio" name="dynamic_name_125"> <input type="radio" name="dynamic_name_125"> </div> <div class="item"> <input type="radio" name="dynamic_name_126"> <input type="radio" name="dynamic_name_126"> <input type="radio" name="dynamic_name_126"> <input type="radio" name="dynamic_name_126"> </div> </div>

---

OP發表評論后

我添加了一個array ，而不是 select 所有收音機 i select 所有項目 div 並檢查第一個單選按鈕的名稱與數組進行比較並包括如果不包括