驗證單選按鈕

我使用php處理表單，我也想在客戶端添加驗證。我閱讀about.com有關使用javascript驗證單選按鈕的教程，並根據其指導原則設置此示例。驗證單選按鈕

a）爲什麼不顯示警報消息？

b）我如何將警報消息替換爲一些innerHtml文本？

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html><head> 

<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>validateradio</title> 


<script type="text/javascript"> 


function valButton(btn) { 
    var cnt = -1; 
    for (var i=btn.length-1; i > -1; i--) { 
     if (btn[i].checked) {cnt = i; i = -1;} 
    } 
    if (cnt > -1) return btn[cnt].value; 
    else   return null; 

} 




function valButton2(form){ 

var btn=valButton(form.group1); 
if (btn==null){alert('no radio button selected');} 
else alert('button value' + btn + 'selected'); 


} 


</script> 


</head> 


<body style="color: rgb(0, 0, 0); background-color: rgb(255, 255, 255);" alink="#000088" link="#0000ff" vlink="#ff0000"><br> 

<form name="myform"> 


<label for="r1"><input type="radio" 
name="group1" id="r1" value="1" /> button one</label> 

<label for="r2"><input type="radio" 
name="group1" id="r2" value="2" /> button two</label> 

<label for="r3"><input type="radio" 
name="group1" id="r3" value="3" /> button three</label> 


<input type="submit" name="submitit" onclick="valbutton2(myform);" value="Validate" /> 



</form> 



</body></html>

來源

2010-08-27 andandandand

看起來像個案問題。您的提交按鈕的onclick處理程序是valbutton2(myform);，但您嘗試調用的函數的名稱實際上是valButton2。

關於獲取innerHTML，不使用框架，它可能有點醜。一種解決方案將是一個ID添加到包含相應的單選按鈕的ID標籤：

<label for="r1" id="lbl-r1"><input type="radio" name="group1" id="r1" value="1" /> button one</label>

然後從你的第二個函數返回到選定的單選按鈕的引用，而不是它的價值return btn[cnt];而不是return btn[cnt].value;的。然後，你可以使用類似下面的訪問標籤文本：

var id = btn.getAttribute("id"); 
var lbl = document.getElementById("lbl-" + id); 
for (var i = 0; i < lbl.childNodes.length; i++) { 
    var n = lbl.childNodes[i]; 
    if (n.nodeType == 3) { 
     alert(n.nodeValue); 
    } 
}

我一直在使用jQuery和其他框架了這麼久，現在我比在平直的JavaScript這樣做有點生疏多，所以這可能可以改善很多，但你明白了。

來源

2010-08-28 00:13:55 Bryan

謝謝，這解決了我的第一個問題。 – andandandand 2010-08-28 00:21:30

順便說一句，你用編輯器來捕捉？我正在研究Ubuntu的gedit，並希望能夠幫助您發現語法問題。 – andandandand 2010-08-28 00:23:18

查看我的更新以獲取文本的可能方式。我沒有使用編輯器，只是通過查找來捕捉它。 – Bryan 2010-08-28 00:43:49

驗證單選按鈕

回答

相關問題