循環單選按鈕表單javascript

我想循環一個單選按鈕窗體，但沒有成功。循環單選按鈕表單javascript

儘管表單的長度是3（與單選按鈕的數量相同），但我無法訪問單個元素。

目的是改變文字。它的作品如果我想訪問第一個元素：

var child = form.firstChild; 
alert(child.nextSibling.nextSibling.nextSibling.innerHTML);

這將返回第一個單選按鈕文本。

但是，如果我創建一個循環出這個

function getRadioBInfo() { 
    var form = document.getElementById("myform"); 

    for (var i = 0; i < form.length; i++) { 
     var iForm = form[i]; 
     var child = iForm.firstChild; 
     alert(child.nextSibling.nextSibling.nextSibling.innerHTML); 
    } 
}

的..我得到我類型錯誤：孩子是空

什麼是錯的代碼？

HTML

<form action="" name="deliver_form" id="myform" style="display: block;"> 
    <input type="radio" name="delivering" id="radio1" value="deliver"> <label>label1</label><br> 
    <input type="radio" name="delivering" value="comeandtake"> <label>label2</label><br> 
    <input type="radio" name="delivering" value="express"> <label>label3</label> 
</form>

來源

2016-05-30 java

您正在尋找形式的.elements財產。 –

我認爲你是尋找像下面這樣的東西。

var form = document.getElementById("myform"); 
 
    
 
for (var i = 0; i < form.length; i++) { 
 
    var child = form.getElementsByTagName('input')[i]; 
 
    alert(child.nextSibling.nextSibling.innerHTML); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form action="" name="deliver_form" id="myform" style="display: block;"> 
 
    <input type="radio" name="delivering" id="radio1" value="deliver"> <label>label1</label><br> 
 
    <input type="radio" name="delivering" value="comeandtake"> <label>label2</label><br> 
 
    <input type="radio" name="delivering" value="express"> <label>label3</label> 
 
</form>

來源

2016-05-30 13:56:49 Azim

既然你已經標記jquery，你可以使用：

$('[name=delivering']).each(function() { 
    alert($(this).find('label').html()); 
});

來源

2016-05-30 13:48:41 LinkinTED

爲什麼你沒有被name

越來越試試這個

function getRadioBInfo() { 

    var arrRadioBtns = document.getElementsByName("delivering"); 

    for (var i = 0; i < arrRadioBtns.length; i++) { 
     var btn = arrRadioBtns[i];   
     alert (btn.value); 
    } 
}

Working Example

來源

2016-05-30 13:52:29

我認爲OP正在尋找標籤標籤內的文本，但不是單選按鈕的值。如果我錯了，請糾正我的錯誤 – brk

@ user2181397 - 是的，那是正確的！ :-) – java

形式[I]僅包含無線buttons.If你想利用標籤嘗試使用

var lbl = document.getElementsByTagName('label'); 
for (var i=0;i < lbl.length; i++){ lbl[i].innerHTML = 'radio' + i; }

和遍歷標籤和更改文本

來源

2016-05-30 13:53:20 Karthikeyan

，以獲取標籤遵循的單選按鈕後，你可以試試這個：

function getRadioBInfo() { 

    var form = document.getElementById("myform"); 
    var radios = form.querySelectorAll('input[type=radio]'); 
    var i; 

    for (i = 0; i < radios.length; i++) { 
     var radio = radios[i]; 
     console.log(radio.nextSibling.innerHTML); 
    } 
} 

getRadioBInfo();

陷阱：不應該有收音機或按鈕之間的空白。否則nextSibling返回文本，而不是label

demo

來源

2016-05-30 13:57:03 Pimmol

觀察夫婦

變種形式=的document.getElementById（「myForm的」）; 表單不會是一個數組，而是它將會是一個字符串，所以你是迭代的字符串。長度;
您可以使用doucment.getElementsByName讓所有單選按鈕與通用名稱

希望這個片段將是有益的

function getRadioBInfo() { 
//Retun collection of radio button with same name 
var _getRadio = document.getElementsByName("delivering"); 
// loop through the collection 
for(var i = 0;i<_getRadio.length;i++){ 
//nextElementSibling will return label tag next to each radio input 
    console.log(_getRadio[i].nextElementSibling.innerHTML) 
    } 
} 
getRadioBInfo();

Jsfiddle

來源

2016-05-30 13:57:28 brk

循環單選按鈕表單javascript

回答

相關問題