程式工藝藝設計大師

<!DOCTYPE html >
<html >
<head>
<title>加法運算器</title>
<script>
function add() {
var a = parseInt(document.getElementById('a').value);
var b = parseInt(document.getElementById('b').value);
document.getElementById('result').value = a+b ;
}
</script>
</head>
<body>
<input id="a" type="text" />+<input id="b" type="text" />
<button onclick="add()" >＝</button>
<output id="result"></output>
</body>
</html>

<!DOCTYPE html ><html >
<head>
<title>
Form
</title>
<script>
function check1() {
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) {
flag1=i+1;
alert(radio1.item(i).value);
break;
}
}
for(var i=0;i<radio2.length;i++){
if(radio2.item(i).checked==true) {
flag2=i+1;

alert(radio2.item(i).value);
break;
}
}
for(var i=0;i<radio3.length;i++){
if(radio3.item(i).checked==true) {
flag3=i+1;
alert(radio3.item(i).value);
break;
}
}
for(var i=0;i<radio4.length;i++){
if(radio4.item(i).checked==true) {
flag4=i+1;
alert(radio4.item(i).value);
break;
}
}
for(var i=0;i<radio5.length;i++){
if(radio5.item(i).checked==true) {
flag5=i+1;
alert(radio5.item(i).value);
break;
}
}
for(var i=0;i<radio6.length;i++){
if(radio6.item(i).checked==true) {
flag6=i+1;
alert(radio6.item(i).value);
break;
}
}
for(var i=0;i<radio7.length;i++){
if(radio7.item(i).checked==true) {
flag7=i+1;
alert(radio7.item(i).value);
break;
}
}
for(var i=0;i<radio8.length;i++){
if(radio8.item(i).checked==true) {
flag8=i+1;
alert(radio8.item(i).value);
break;
}
}
for(var i=0;i<radio9.length;i++){
if(radio9.item(i).checked==true) {
flag9=i+1;
alert(radio9.item(i).value);
break;
}
}
for(var i=0;i<radio10.length;i++){
if(radio10.item(i).checked==true) {
flag10=i+1;
alert(radio10.item(i).value);
break;
}
}

document.write(flag1,flag2,flag3,flag4,flag5,flag6,flag7,flag8,flag9,flag10,"<br>");
document.write(flag1+flag2+flag3+flag4+flag5+flag6+flag7+flag8+flag9+flag10,"<br>");}

</script>
</head>
<body>
<h1>1、ssss？</h1>
<input name="v1" type="radio" value="1.1">300年
<input name="v1" type="radio" value="1.2">400年
<input name="v1" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v2" type="radio" value="2.1">300年
<input name="v2" type="radio" value="2.2">400年
<input name="v2" type="radio" value="2.3">1000年
<h1>1、ssss？</h1>
<input name="v3" type="radio" value="1.1">300年
<input name="v3" type="radio" value="1.2">400年
<input name="v3" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v4" type="radio" value="1.1">300年
<input name="v4" type="radio" value="1.2">400年
<input name="v4" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v5" type="radio" value="1.1">300年
<input name="v5" type="radio" value="1.2">400年
<input name="v5" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v6" type="radio" value="1.1">300年
<input name="v6" type="radio" value="1.2">400年
<input name="v6" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v7" type="radio" value="1.1">300年
<input name="v7" type="radio" value="1.2">400年
<input name="v7" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v8" type="radio" value="1.1">300年
<input name="v8" type="radio" value="1.2">400年
<input name="v8" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v9" type="radio" value="1.1">300年
<input name="v9" type="radio" value="1.2">400年
<input name="v9" type="radio" value="1.3">1000年
<h1>1、ssss？</h1>
<input name="v10" type="radio" value="1.1">300年
<input name="v10" type="radio" value="1.2">400年
<input name="v10" type="radio" value="1.3">1000年
<input type="button" value="submit" onclick="check1()"/>
</form>
</body>
</html>

<!DOCTYPE html ><html >

<head>
<title>
Form
</title>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
var ArrTest= [];

function check1() {
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");
var a=0;
var b=0;
var c=0;
var asd;
flag1=0;
flag2=0;
flag3=0;
flag4=0;
flag5=0;
flag6=0;
flag7=0;
flag8=0;
flag9=0;
flag10=0;

for(var i=0;i<radio1.length;i++){
if(radio1.item(i).checked==true) {
flag1=i+1;
asd=radio1.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio2.length;i++){
if(radio2.item(i).checked==true) {
flag2=i+1;
asd=radio2.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{

b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio3.length;i++){
if(radio3.item(i).checked==true) {
flag3=i+1;
asd=radio3.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio4.length;i++){
if(radio4.item(i).checked==true) {
flag4=i+1;
asd=radio4.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio5.length;i++){
if(radio5.item(i).checked==true) {
flag5=i+1;
asd=radio5.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio6.length;i++){
if(radio6.item(i).checked==true) {
flag6=i+1;
asd=radio6.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio7.length;i++){
if(radio7.item(i).checked==true) {
flag7=i+1;
asd=radio7.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio8.length;i++){
if(radio8.item(i).checked==true) {
flag8=i+1;
asd=radio8.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio9.length;i++){
if(radio9.item(i).checked==true) {
flag9=i+1;
asd=radio9.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

for(var i=0;i<radio10.length;i++){
if(radio10.item(i).checked==true) {
flag10=i+1;
asd=radio10.item(i).value;
if(asd=="1.1")
{
a++;
break;
}
else if(asd=="1.2")
{
b++;
break;
}
else if(asd=="1.3")
{
c++;
break;
}
break;
}
}

alert(a);
alert(b);
alert(c);

//var string=flag1,flag2,flag3,flag4,flag5,flag6,flag7,flag8,flag9,flag10

document.getElementById('aa').value="選項:" + flag1 +flag2+flag3+flag4+flag5+flag6+flag7+flag8+flag9+flag10+" "+"總和:";
document.getElementById('bb').value= flag1 +flag2+flag3+flag4+flag5+flag6+flag7+flag8+flag9+flag10;

//data.addRows(ArrTest);
//alert(ArrTest[0]); //輸出 ['Pepperoni', 4]
var ArrTest1=[];
ArrTest1[0]="一";
ArrTest1[1]=a;
var ArrTest2=[];
ArrTest2[0]="二";
ArrTest2[1]=b;
var ArrTest3=[];
ArrTest3[0]="三";
ArrTest3[1]=c;

ArrTest[0]=ArrTest1;
ArrTest[1]=ArrTest2;
ArrTest[2]=ArrTest3;

google.charts.load("current", {packages:["corechart"]});
google.charts.setOnLoadCallback(drawChart);

//document.write(flag1+flag2+flag3+flag4+flag5+flag6+flag7+flag8+flag9+flag10,"<br>");
}

function drawChart() {

var data = new google.visualization.DataTable();
data.addColumn('string', 'Pizza');
data.addColumn('number', 'Populartiy');
data.addRows(ArrTest);

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

var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));
chart.draw(data, options);

}
</script>
</head>
<body>