2013-07-26 117 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'。谢谢你。 –