單選按鈕陣列

Question

我有一個表單，您可以在某個位置添加同一個問題的多行。簡化版本如下所示：

<input type="text" name="name[]" value=""/> 
<input type="radio" name="opted[]" value="Yes" /> Yes 
<input type="radio" name="opted[]" value="No" /> No 

上面的行克隆在每個「添加朋友」按鈕上單擊。這適用於文本字段，因爲我從提交的所有行中獲取值，但單選按鈕不起作用，因爲它具有相同的名稱並單擊它會干擾其他克隆的行。

任何想法如何解決這個問題？

Answer 1

將name="opted[]"替換爲name="opted[123]"，其中123是唯一標識符，以便每組答案都被分組。

然後，可以通過以下兩種方法的訪問的形式的元素：

var method1 = document.getElementsByName("opted[123]"); 
var method2 = document.querySelectorAll("[name='opted[123]']"); 
//Both vanilla-JavaScript methods return a NodeList, consisting of all 
// elements with name="opted[123]"