2013-07-26 58 views
1

我正在尋找一種方法來通過引用全局數組的下拉菜單將列值動態添加到表中。下面是我寫的代碼,這裏是運行示例的鏈接:jsFiddle。我是JavaScript新手,我知道的一切都是自學,所以請耐心等待,並提前感謝您的幫助。動態填充表的總和值

<!DOCTYPE html> 
<html> 
    <head> 
     <title> </title> 
     <script> 
      var x= ["",1,2,3,4,5,6,7,8,9,10]; 
      var y= ["",4,6,3,4,5,6,7,8,9,10]; 
      var z= ["",1,2,3,4,5,6,7,8,9,10]; 
    </script> 
    <script> 
     function fill(){ 
      var si= document.getElementById('ddone').selectedIndex; 
      if (si!==0){ 
       var a= x[si]; 
       var b= y[si]; 
       document.getElementById('one').innerHTML=a; 
       document.getElementById('two').innerHTML=b; 
      }}; 
     </script> 
     <script> 
     function fill2(){ 
      var si2= document.getElementById('ddtwo').selectedIndex;    
      if(si2!==0){ 
       var c=z[si2]; 
       var d=z[si2]; 
       document.getElementById('three').innerHTML=c; 
       document.getElementById('four').innerHTML=d; 
      }}; 
     </script> 
     <script> 
      function total(){ 
       var w= parseInt(document.getElementById('one').value,10); 
       var x= parseInt(document.getElementById('two').value,10); 
       var y=parseInt(document.getElementById('three').value,10); 
       var z= parseInt(document.getElementById('four').value,10); 
       document.getElementById('five').innerHTML=w+y; 
       document.getElementById('six').innerHTML=x+z; 
}; 
     </script> 
    </head> 
    <body> 
<select id='ddone' onchange= 'fill()'> 
    <option></option> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
    <option>4</option> 
</select> 
<select id='ddtwo' onchange='fill2()'> 
    <option></option> 
    <option>1</option> 
    <option>2</option> 
    <option>3</option> 
    <option>4</option> 
</select> 
<table border=1px width=25%> 
    <tr> 
     <td id='one'></td> 
     <td id='two'></td> 
    </tr> 
    <tr> 
     <td id='three'></td> 
     <td id='four'></td> 
    </tr> 
    <tr> 
     <td id='five'></td> 
     <td id='six'></td> 
    </tr> 
</table> 
<button id='button' onclick='total()'>total</button> 
</body> 
</html> 
+0

是否要計算每欄總數或全部總和? – jsalonen

+0

我想計算每列的總和。是否有理由不能簡單地「獲得」填充到單元格中的值? –

回答

0

開關valueinnerHTML和您的代碼將很好地工作。請參閱此小提琴以獲取證明:http://jsfiddle.net/Nt9nC/7/

+0

這工作完美!非常感謝你。爲了讓我可以學習,爲什麼'價值'不起作用? –

+0

值是指值屬性。如果你有一個輸入字段而不是普通單元格,那麼在這種情況下'value'就可以工作。 – jsalonen

+1

太棒了,我明白了。謝謝。這個網站真棒。 –

0

你提取整數的方式看起來不正確。如果你想獲得一個td元素中的文本嘗試innerText,像這樣:

parseInt(document.getElementById('one').innerText,10) 
+0

我也試過這個,'innerText'不起作用。它仍然返回'NaN'。謝謝你。 –