<html>
  <head>
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
    <script type="text/javascript">
      google.charts.load('current', {'packages':['corechart']});
      google.charts.setOnLoadCallback(drawChart);
      var a,b,c,d,e,f,g,h,i,j;
      a=0
      function add() {
      
      b=3;
      c=3;
      d=3;
      e=3;
      f=3;
      g=3;
      h=3;
      i=3;
      j=3;
     
      var radio1=document.getElementsByName("v1");
      var radio2=document.getElementsByName("v2");
      var radio3=document.getElementsByName("v3");
      var radio4=document.getElementsByName("v4");
      var radio5=document.getElementsByName("v5");
      var radio6=document.getElementsByName("v6");
      var radio7=document.getElementsByName("v7");
      var radio8=document.getElementsByName("v8");
      var radio9=document.getElementsByName("v9");
      var radio10=document.getElementsByName("v10");
       for(var i=0;i<radio1.length;i++)
   {
         if(radio1.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c1').value=a;
         break;
      }
   }
       for(var i=0;i<radio2.length;i++)
   {
         if(radio2.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c2').value=a;
         break;
      }
   }
     for(var i=0;i<radio3.length;i++)
   {
         if(radio3.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
     
     document.getElementById('c3').value=a;
         break;
      }
   }
    for(var i=0;i<radio4.length;i++)
   {
         if(radio4.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c4').value=a;
         break;
      }
   }
    for(var i=0;i<radio5.length;i++)
   {
         if(radio5.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c5').value=a;
         break;
      }
   }
   for(var i=0;i<radio6.length;i++)
   {
         if(radio6.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c6').value=a;
         break;
      }
   }
   for(var i=0;i<radio7.length;i++)
   {
         if(radio7.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c7').value=a;
         break;
      }
   }
   for(var i=0;i<radio8.length;i++)
   {
         if(radio8.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c8').value=a;
         break;
      }
   }
   for(var i=0;i<radio9.length;i++)
   {
         if(radio9.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c9').value=a;
         break;
      }
   }
   for(var i=0;i<radio10.length;i++)
   {
         if(radio10.item(i).checked==true)
             {
     i=i+1
     alert(i);
   if(i==1)
     {
   a=a+1;
     }
      
     document.getElementById('c10').value=a;
         break;
      }
   }
     drawChart();
      }
      function drawChart() {
     
      

        var data = google.visualization.arrayToDataTable([
          ['Task', 'Hours per Day'],
          ['Work',     a],
          ['Eat',      b],
          ['Commute',  c],
          ]);

        var options = {
          title: 'My Daily Activities'
        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart'));

        chart.draw(data, options);
      }
    </script>
  </head>
  <body>
       <h1>1、你選了什麼?</h1>
       <input name="v1" type="radio" value="300年">300年                 
       <input name="v1" type="radio" value="400年">400年               
       <input name="v1" type="radio" value="1000年">1000年
       <h1>2、你選了什麼?</h1>
       <input name="v2" type="radio" value="300年">300年                 
       <input name="v2" type="radio" value="400年">400年               
       <input name="v2" type="radio" value="1000年">1000年
       <h1>3、你選了什麼?</h1>
       <input name="v3" type="radio" value="300年">300年                 
       <input name="v3" type="radio" value="400年">400年               
       <input name="v3" type="radio" value="1000年">1000年
       <h1>4、你選了什麼?</h1>
       <input name="v4" type="radio" value="300年">300年                 
       <input name="v4" type="radio" value="400年">400年               
       <input name="v4" type="radio" value="1000年">1000年
       <h1>5、你選了什麼?</h1>
       <input name="v5" type="radio" value="300年">300年                 
       <input name="v5" type="radio" value="400年">400年               
       <input name="v5" type="radio" value="1000年">1000年
       <h1>6、你選了什麼?</h1>
       <input name="v6" type="radio" value="300年">300年                 
       <input name="v6" type="radio" value="400年">400年               
       <input name="v6" type="radio" value="1000年">1000年
       <h1>7、你選了什麼?</h1>
       <input name="v7" type="radio" value="300年">300年                 
       <input name="v7" type="radio" value="400年">400年               
       <input name="v7" type="radio" value="1000年">1000年
       <h1>8、你選了什麼?</h1>
       <input name="v8" type="radio" value="300年">300年                 
       <input name="v8" type="radio" value="400年">400年               
       <input name="v8" type="radio" value="1000年">1000年
       <h1>9、你選了什麼?</h1>
       <input name="v9" type="radio" value="300年">300年                 
       <input name="v9" type="radio" value="400年">400年               
       <input name="v9" type="radio" value="1000年">1000年
       <h1>10、你選了什麼?</h1>
       <input name="v10" type="radio" value="300年">300年                 
       <input name="v10" type="radio" value="400年">400年               
       <input name="v10" type="radio" value="1000年">1000年
   <br>
   c1:
   <input type="text"name="FirstName"id="c1"<br><br/>
   c2:
   <input type="text"name="address"id="c2"<br><br/>
   c3:
   <input type="text"name="address"id="c3"<br><br/>
   c4:
   <input type="text"name="address"id="c4"<br><br/>
   c5:
   <input type="text"name="address"id="c5"<br><br/>
   c6:
   <input type="text"name="address"id="c6"<br><br/>
   c7:
   <input type="text"name="address"id="c7"<br><br/>
   c8:
   <input type="text"name="address"id="c8"<br><br/>
   c9:
   <input type="text"name="address"id="c9"<br><br/>
   c10:
   <input type="text"name="address"id="c10"<br><br/>
    <input type="button" value="onSubmit" onclick="add()"  />
    <div id="piechart" style="width: 900px; height: 500px;"></div>
 
  </body>
</html>

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 E163687413 的頭像
    E163687413

    E163687413的部落格

    E163687413 發表在 痞客邦 留言(0) 人氣()