之前寫的四則運算1.0版，現在繼續擴充 ： 《四則運算》題目的功能，要求： 題目避免重覆；可以定製數量和列印方式； 可以控制下列參數 （1） 是否有乘除法 （2） 是否有括弧 （3） 數值範圍 （4） 加減有無負數 （5） 除法有無餘數 （6） 是否支持分數（真分數、假分數…） （7） 是否支持小數
之前寫的四則運算1.0版，現在繼續擴充 ：
《四則運算》題目的功能，要求：
題目避免重覆；可以定製數量和列印方式；
可以控制下列參數
（1） 是否有乘除法
（2） 是否有括弧
（3） 數值範圍
（4） 加減有無負數
（5） 除法有無餘數
（6） 是否支持分數（真分數、假分數…）
（7） 是否支持小數（精確到多少位？）
（8） 列印中每行的間隔
先上圖看主要界面，及功能區，如下：
1：
一如既往的用JS來寫，自認為在界面上可以做到更美觀，功能也可以完全做到，
那麼找幾個功能來演示，那麼就從預設條件吧：
先上代碼，然後再看如何實現的：
1 function default_fun(){ /////////////預設條件函數 2 ifture_dx_1=1; 3 ifture_dx_2=2; 4 ifture_dx_3=0; 5 ifture_dx_4=0; 6 ifture_dx_5=5; 7 8 Ture_numble_01=0; 9 Ture_numble_02=50; 10 Ture_numble_2=1; 11 Ture_numble_3=0; 12 13 Main_function(); 14 }
各個value分別表示的是：
ifture_dx_1=1 對應 “是否有乘除法”
ifture_dx_2=2 對應“ 是否有括弧
ifture_dx_3=3 對應“加減是否有無負數
ifture_dx_4=0 對應“除法有無餘數
ifture_dx_5=5 對應“是否支持假分數 （Ture_numble_01=0;Ture_numble_02=50;）表示的是對應數字的給出範圍 Ture_numble_2=1 對應”列印行間隔 Ture_numble_3=0 對應“小數位數
以上 都是 預設條件 ： 有乘除法 ， 有括弧，有負數，無餘數，支持假分數，隨機數範圍（0———50），無小數位。
上圖看看列印結果：
2：
先貼個確定函數代碼：
1 function True_fun(){ //////////確定條件函數 2 if (true==document.getElementById("dx_1").checked){ 3 ifture_dx_1=1; 4 } 5 if (true==document.getElementById("dx_2").checked){ 6 ifture_dx_2=2; 7 } 8 if (true==document.getElementById("dx_3").checked){ 9 ifture_dx_3=3; 10 } 11 if (true==document.getElementById("dx_4").checked){ 12 ifture_dx_4=4; 13 } 14 if (true==document.getElementById("dx_5").checked){ 15 ifture_dx_5=5; 16 } 17 18 Ture_numble_01= parseInt(document.getElementById("numble_01").value); 19 Ture_numble_02=parseInt(document.getElementById("numble_02").value); 20 Ture_numble_2= parseInt(document.getElementById("numble_2").value); 21 Ture_numble_3=parseInt(document.getElementById("numble_3").value); 22 23 Main_function(); 24 }
獲取checkebox是否被點擊，以及input輸入框的輸入值。
3：
接下來演示第一個功能，這就不貼代碼了 後面貼上源代碼
列印如下：
其他功能不再演示 ：
源代碼碼上：
1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 <head> 4 <meta charset="utf-8"> 5 <title>四則運算</title> 6 </head> 7 <body bgcolor="#F4A460"> 8 <h1 align="center">四則運算</h1> 9 <hr /> 10 <h4>隨機生成二十到四則運算題：</h4><br/> 11 <form action=""> 12 <p>請選擇條件：</p> 13 <input type="checkbox" id="dx_1" value="1">是否有乘除法 14 <input type="checkbox" id="dx_2" value="b">是否有括弧 15 <input type="checkbox" id="dx_3" value="c">加減有無負數 16 <input type="checkbox" id="dx_4" value="d">除法有無餘數 17 <input type="checkbox" id="dx_5" value="e">是否支持假分數 <br/> <br/> 18 數字範圍：<input type="number" id="numble_01" min="-100" max="100" /> 到 19 <input type="number" id="numble_02" min="-100" max="100" /> 20 列印中行的間隔：<input type="number" id="numble_2" min="2" max="20" /> 21 支持幾位小數：<input type="number" id="numble_3" min="0" max="10" /><br><br> 22 <button type="reset">條件重置</button> 23 <button type="button" onclick="default_fun()">預設條件</button> 24 <button type="button" onclick="True_fun()">確定</button> 25 <hr/> 26 </form> 27 <script> 28 var ifture_dx_1=null,ifture_dx_2=null,ifture_dx_3=null,ifture_dx_4=null,ifture_dx_5=null; 29 var Ture_numble_01=0,Ture_numble_02=0,Ture_numble_2=2,Ture_numble_3=0; 30 31 function True_fun(){ //////////確定條件函數 32 if (true==document.getElementById("dx_1").checked){ 33 ifture_dx_1=1; 34 } 35 if (true==document.getElementById("dx_2").checked){ 36 ifture_dx_2=2; 37 } 38 if (true==document.getElementById("dx_3").checked){ 39 ifture_dx_3=3; 40 } 41 if (true==document.getElementById("dx_4").checked){ 42 ifture_dx_4=4; 43 } 44 if (true==document.getElementById("dx_5").checked){ 45 ifture_dx_5=5; 46 } 47 48 Ture_numble_01= parseInt(document.getElementById("numble_01").value); 49 Ture_numble_02=parseInt(document.getElementById("numble_02").value); 50 Ture_numble_2= parseInt(document.getElementById("numble_2").value); 51 Ture_numble_3=parseInt(document.getElementById("numble_3").value); 52 53 Main_function(); 54 } 55 function default_fun(){ /////////////預設條件函數 56 ifture_dx_1=1; 57 ifture_dx_2=2; 58 ifture_dx_3=0; 59 ifture_dx_4=0; 60 ifture_dx_5=5; 61 62 Ture_numble_01=0; 63 Ture_numble_02=50; 64 Ture_numble_2=1; 65 Ture_numble_3=0; 66 67 Main_function(); 68 } 69 function Max_fun(){ /////////////求最大值函數 70 if(Ture_numble_01<Ture_numble_02){ 71 return Ture_numble_02; 72 } 73 else{ 74 return Ture_numble_01; 75 } 76 } 77 function Min_fun(){ ///////////// 求最小值函數 78 if(Ture_numble_01<Ture_numble_02){ 79 return Ture_numble_01; 80 } 81 else{ 82 return Ture_numble_02; 83 } 84 } 85 function Get_num(min,max){ ///////////給出範圍內整數函數 86 return Math.floor(Math.random()*(max-min))+min; 87 } 88 function if_brackets(num){ //////////是否添加括弧函數 89 if(ifture_dx_2==2&&num<0){ 90 return "("+num+")"; 91 }else{ 92 return num; 93 } 94 } 95 96 function if_xiaoshu(x,y){ ///////////取小數函數 97 var a=x/y,b=x%y,c=x-y; 98 if(ifture_dx_4==4){ 99 if(c<0){ 100 return 0+":"+"因為分子比分母小，所以值為0"; 101 }else{ 102 return a.toFixed(0)+":餘數為"+b; 103 } 104 }else{ 105 return a.toFixed(Ture_numble_3); 106 } 107 108 } 109 </script> 110 <script> 111 var x,y,i=0; 112 var value,a,b,c,flag=0; 113 function Main_function(){ 114 if(Min_fun()<0){ 115 flag=1; 116 } 117 for(i=0;i<20;i++){ 118 x=Get_num(Min_fun(),Max_fun()); 119 do{ 120 y=Get_num(Min_fun(),Max_fun()); 121 }while(y==0); 122 if(ifture_dx_1==1){ ////////////是否有乘除法 123 value=parseInt(10*Math.random()%4); 124 }else{ 125 value=parseInt(10*Math.random()%2); 126 } 127 a=x+y; 128 b=x-y; 129 c=x*y; 130 switch(value) 131 { 132 case 0:for(var j=0;j<Ture_numble_2;j++){ 133 document.write("<br>"); 134 } 135 if(ifture_dx_3==3&&flag==1){ 136 while(a>0){ 137 x=Get_num(Min_fun(),Max_fun()); 138 a=x+y; 139 } 140 document.write(i+1+"題"+":"+if_brackets(x)+"+"+if_brackets(y)+"="+a+"<br>"); 141 }else{ 142 document.write(i+1+"題"+":"+if_brackets(x)+"+"+if_brackets(y)+"="+a+"<br>"); 143 } 144 break; 145 case 1:for(var j=0;j<Ture_numble_2;j++){ 146 document.write("<br>"); 147 } 148 if(ifture_dx_3==3){ 149 while(b>0){ 150 x=Get_num(Min_fun(),Max_fun()); 151 b=x-y; 152 } 153 document.write(i+1+"題"+":"+if_brackets(x)+"-"+if_brackets(y)+"="+b+"<br>"); 154 }else{ 155 document.write(i+1+"題"+":"+if_brackets(x)+"-"+if_brackets(y)+"="+b+"<br>"); 156 } 157 break; 158 case 2:for(var j=0;j<Ture_numble_2;j++){ 159 document.write("<br>"); 160 } 161 document.write(i+1+"題"+":"+if_brackets(x)+"*"+if_brackets(y)+"="+c+"<br>"); 162 break; 163 case 3:for(var j=0;j<Ture_numble_2;j++){ 164 document.write("<br>"); 165 } 166 if (ifture_dx_5!=5){ 167 while(b>0){ 168 x=Get_num(Min_fun(),Max_fun()); 169 b=x-y; 170 } 171 document.write(i+1+"題"+":"+if_brackets(x)+"/"+if_brackets(y)+"="+if_xiaoshu(x,y)+"<br>"); 172 }else{ 173 174 document.write(i+1+"題"+":"+if_brackets(x)+"/"+if_brackets(y)+"="+if_xiaoshu(x,y)+"<br>"); 175 } 176 break; 177 default:break; 178 } 179 } 180 181 } 182 183 184 </script> 185 </body> 186 </html>View Code
