需要幫助來顯示輸出到texbox使用Javascript

Question

該代碼將不會顯示在文本框中的總數我需要你的幫助與我的代碼請。

代碼在這裏：

<script> 
    function optTotal() 
    { 
     var a = document.frm.optA.value; 
     if (!a) 
     a = '0'; 
     var b = document.frm.optB.value; 
     if (!b) 
     b = '0'; 
     var c = document.frm.optC.value; 
     if (!c) 
     c = '0'; 
     var d = document.frm.optD.value; 
     if (!d) 
     d = '0'; 
     var optA = parseFloat(a); 
     var optB = parseFloat(b); 
     var optC = parseFloat(c); 
     var optD = parseFloat(d); 
     document.frm.total.value = optA + optB + optC + optD; 
    } 
</script> 

代碼在這裏：

<form method="post" action="index.php" name="frm" id="frm" > 
    <input type="text" name="name" /> 
    <input type="radio" name="optA" value="1" onclick="optTotal()" />1 
    <input type="radio" name="optA" value="2" onclick="optTotal()" />2 
    <input type="radio" name="optA" value="3" onclick="optTotal()" />3 
    <input type="radio" name="optB" value="1" onclick="optTotal()" />1 
    <input type="radio" name="optB" value="2" onclick="optTotal()" />2 
    <input type="radio" name="optB" value="3" onclick="optTotal()" />3 
    <input type="radio" name="optC" value="1" onclick="optTotal()" />1 
    <input type="radio" name="optC" value="2" onclick="optTotal()" />2 
    <input type="radio" name="optC" value="3" onclick="optTotal()" />3 
    <input type="radio" name="optD" value="1" onclick="optTotal()" />1 
    <input type="radio" name="optD" value="2" onclick="optTotal()" />2 
    <input type="radio" name="optD" value="3" onclick="optTotal()" />3 
    <input type="text" name="total" id="total" onkeyup="optTotal()" /> 
    <input type="submit" value="enter" name="calculate" /> 
</form> 

我想我的代碼顯示在文本框中實時輸出。

Answer 1

按照以下步驟

var a1 = document.querySelector('input[name="optA"]:checked'); 
var b1 = document.querySelector('input[name="optB"]:checked'); 
var c1 = document.querySelector('input[name="optC"]:checked'); 
var d1 = document.querySelector('input[name="optD"]:checked'); 
if (a1 != null) 
    a1 = parseFloat(a1.value); 
else 
    a1 = 0; 
if (b1 != null) 
    b1 = parseFloat(b1.value); 
else 
    b1 = 0; 
if (c1 != null) 
    c1 = parseFloat(c1.value); 
else 
    c1 = 0; 
if (d1 != null) 
    d1 = parseFloat(d1.value); 
else 
    d1 = 0; 

document.frm.total.value=parseFloat(a1)+parseFloat(b1)+parseFloat(c1)+parseFloat(d1); 

Answer 2

DEMO點擊第一行中的任何選擇，我修改了用於演示

document.frm.optA返回節點列表的數組，表示所有的名字都是OPTA

你必須

單選按鈕

var a = document.frm.optA // This will return all radio buttons whoose names are optA 
for(var i=0;i<a.length;i++) 
{ 
     if(a[i].checked) 
     { 
       alert(a[i].value); 
     } 
} 

Answer 3

我已經創建了一個腳本來解決您的問題，請看看。

function getCheckedRadio(radio_group) { 
     var radio_group = document.getElementsByName(radio_group); 
     for (var i = 0; i < radio_group.length; i++) { 
      var button = radio_group[i]; 
      if (button.checked) { 
       return button.value; 
      } 
     } 
     return undefined; 
    } 

    function optTotal() 
    { 
     var a = getCheckedRadio("optA");// pass radio button group name 
     if (!a) 
     a = '0'; 
     var b = getCheckedRadio("optB");// pass radio button group name 
     if (!b) 
     b = '0'; 
     var c = getCheckedRadio("optC");// pass radio button group name 
     if (!c) 
     c = '0'; 
     var d = getCheckedRadio("optD");// pass radio button group name 
     if (!d) 
     d = '0'; 
     var optA = parseFloat(a); 
     var optB = parseFloat(b); 
     var optC = parseFloat(c); 
     var optD = parseFloat(d); 
     document.frm.total.value = optA + optB + optC + optD; 

    }