js练习V1

①ｈｔｍｌページのソース：

js.html(个人参考学习)

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>JavaScript</title>
 6 
 7 
 8 <script language="javascript" src="js.js">
 9 //document.write("JAVASCRIPT WELCOME TO YOU ようこそ");
10 </script>
11 
12 </head>
13 
14 <body>
15 <p><center >NEC済南(Html中)</center>
16 <form id="calc" name="calc" method="post" action="js.html">
17   <table width="300" border="0" align="center">
18     <tr>
19       <td><center>报销金额计算</center></td>
20     </tr>
21     <tr>
22       <td>Price:
23         <label for="num1"></label>
24       <input type="text" name="num1" id="num1" /></td>
25     </tr>
26     <tr>
27       <td>Numbers:
28         <label for="num2"></label>
29       <input type="text" name="num2" id="num2" /></td>
30     </tr>
31     <tr>
32       <td>Total:
33         <label for="result"></label>
34       <input type="text" name="result" id="result" /></td>
35     </tr>
36     <tr>
37       <td><input type="button" name="answer"  onclick="calcf()" value="計算" /></td>
38     </tr>
39   </table>
40 </form>
41 
42 <form id="form1" name="form1" method="post" action="">  
43   <table width="300" border="0">
44     <tr>
45       <td>Number1：
46         <label for="num1"></label>
47       <input type="text" name="num3" id="num1" /></td>
48     </tr>
49     <tr>
50       <td>Number2：
51         <label for="num2"></label>
52       <input type="text" name="num4" id="num2" /></td>
53     </tr>
54     <tr>
55       <td>&nbsp;&nbsp;Operte： 
56          <input type="button" name="addbutt"  value="加"   onclick="f('+')"/>
57          <input type="button" name="subbutt2"  value="减"  onclick="f('-')"/>
58          <input type="button" name="mulbutt3"  value="乘"  onclick="f('*')"/>
59          <input type="button" name="divbutt4"  value="除"  onclick="f('/')"/></td>
60     </tr>
61     <tr>
62       <td>&nbsp;&nbsp;&nbsp;Result：
63         <label for="result"></label>
64       <input type="text" name="result" /></td>
65     </tr>
66   </table>
67 </form>
68 
69 
70 <form name="msg" method="post" action="">
71     <table width="300" border="0" >
72         <tr>
73             <td>Name:
74             <input type="text" name="username" /> </td> 
75         </tr>
76         <tr>
77             <td>&nbsp;&nbsp;&nbsp;&nbsp;Tel:
78             <input type="text" name="Tel" /></td>
79         </tr>
80         <tr>
81             <td>E-Mail:
82             <label for="Email"></label>
83             <input type="text" name="email" /></td>
84         </tr>
85         <tr>
86              <td>Context:
87             <label for="textarea"></label>
88             <textarea name="context" cols="45" rows="5"></textarea></td>
89          </tr> 
90       <tr>
91           <td>
92           <input type="submit" name="Send" value = "送付" onclick="msgf()"/>
93         <input type="reset"  name="reset" value="リセット" /></td>
94       </tr>
95     </table>
96 </form>
97 </body>
98 </html>

②javascriptページのソース：

js.js

  1 // JavaScript Document
  2 //------------------------------------------------------------------------------------------------------------------------------------------------------------
  3 /*
  4 document.write("Welcome to NEC(済南)" + "<BR>");
  5 document.write("link js中\n");
  6 var x ;
  7 x = prompt("Please input a number……",5);
  8 
  9 document.write("Your Number is:"+ x + "<BR>");
 10 document.write("How about it???");
 11 alert("Good Bye!!!");
 12 */
 13 //------------------------------------------------------------------------------------------------------------------------------------------------------------
 14 /*
 15 var x=100;
 16 var y;
 17 var z;
 18 document.write("<H2>SONYのカメラ" +x+"$から競売</H2>");
 19 y=prompt("何円を増える","1");
 20 z=x+parseFloat( y );  
 21 alert("最終競売の価格\n"+z+"$");  //"\n"変換行
 22 document.write("最終競売の価格\n"+z+"$");
 23 */
 24 //------------------------------------------------------------------------------------------------------------------------------------------------------------
 25 
 26 /*
 27     function calcf(){
 28     
 29     var number1 = document.calc.num1.value;
 30     var number2 = document.calc.num2.value;
 31     var total = parseFloat(number1) * parseFloat(number2);
 32     document.calc.result.value = total;
 33     }
 34     
 35 */
 36 //------------------------------------------------------------------------------------------------------------------------------------------------------------
 37 
 38 var myDate = new Date();
 39 document.write("系统的当前时间：" + myDate.getFullYear() + "年" + (myDate.getMonth() + 1)+ "月" +myDate.getDate() + "日" + myDate.getHours() + "时" + myDate.getMinutes() + "分" + myDate.getSeconds() + "秒");    
 40             //------------------------------------------------------------------------------------------------------------------------------------------------------------
 41             
 42             
 43 //实现两数字的相乘运算，在其中要验证输入的正确和结果的正确。
 44 document.write(LocalDateDemo());
 45 function calcf(){
 46     
 47     var number1 = document.calc.num1.value;    
 48     var number2 = document.calc.num2.value;    
 49     var total = parseFloat(number1) * parseFloat(number2);
 50     
 51     if((number1 == "") || (number2 == "")){
 52         alert("您漏输入项目了，请检查：");
 53         }
 54         
 55     document.calc.result.value = total;        
 56     
 57         
 58     if(total >= 1000){
 59         alert("金额太大不能报销！\n请修改之后再计算报销额。");
 60         }
 61         
 62     }
 63 
 64 //------------------------------------------------------------------------------------------------------------------------------------------------------------
 65 
 66 /*for循环联系打印直线的三角形
 67 document.write("输出了一个金字塔");
 68 for(var i = 0 ;i <=50; i=i+2){
 69     document.write("<HR align = center color = red width = "+ i + "%>");
 70     }    
 71 */
 72 //------------------------------------------------------------------------------------------------------------------------------------------------------------    
 73 /*
 74 document.write("<H3>1つ文字は1つエジプト画像を対応する</H3>");
 75 do
 76 {
 77    var c = prompt("1つ文字を入力ください。N又はｎを入力時、中止","A") ;
 78    document.write ("<font class=myfont >"+c+"</font>");
 79  }while (c !="N" && c !="n");    
 80  
 81 */
 82 //------------------------------------------------------------------------------------------------------------------------------------------------------------     
 83 /*
 84 var str1=prompt("1つ式を入力し、計算する","1+1");
 85 var result=eval(str1);
 86 document.write(str1+"="+result);
 87 var x = prompt("1つ数字を入力してください","0");
 88 if (isNaN(x)) 
 89   alert (x + "数字がではない");
 90 else
 91   alert (x + "数字です");
 92 */  
 93   //------------------------------------------------------------------------------------------------------------------------------------------------------------     
 94   function f (op){
 95           var num1 = parseFloat (document.form1.num1.value);
 96         var num2 = parseFloat (document.form1.num2.value);        
 97          
 98          if((num1 != 0) && (num2 != 0)){
 99              
100             switch(op){            
101             
102             case "+":
103             document.form1.result.value=num1+num2;
104             break;
105             
106             case "-":
107             document.form1.result.value = num1 - num2;
108             break;
109             
110             case "*":
111             document.form1.result.value = num1 * num2;
112             break;
113             
114             case "/":
115             if(num2 == 0){
116                 alert("在进行除法运算时：除数不能为0！！！");
117                 }
118             document.form1.result.value = num1 / num2;
119             break;
120             
121             default:
122              document.form1.result.value = null;
123             }    
124         }
125         else{
126             alert("您漏输入项目了，请检查：");        
127             
128             }    
129             
130       }
131       
132 //------------------------------------------------------------------------------------------------------------------------------------------------------------     
133 /*这个是检测Email格式的函数*/
134     function chk(i){
135     d=i.match(/^\S+@\S+\.\S+$/);
136     if(!d||!i)return false;
137     return true;
138     }
139     
140     
141 //用户留言的判断    
142 function msgf(){
143     var username = document.msg.username.value;    
144     var email = document.msg.email.value;
145     var context = document.msg.context.value;
146     
147     //判断用户名是否为空
148     if(username != ""){    
149         //判断邮箱的地址是否为空
150         if(document.msg.email.value != ""){        
151             //判断邮箱的格式是否正确
152             if(chk(document.msg.email.value)){
153                 
154                 //判断留言的内容是否为空
155                 if(context != ""){
156                     alert("确认提交吗？");                
157                     }
158                     
159                 else{
160                     alert("留言内容不能为空，请重新输入！");
161                     return false;
162                     }                    
163                 }
164                 
165             else{
166                 alert("请输入你的正确的邮箱地址！");
167                 return false;
168                 }            
169             }
170             
171         else{
172             alert("请输入您的正确的邮箱地址：");
173             return false;            
174             }        
175         }
176         
177     else{
178         alert("用户名不能为空！");
179         return false;
180             }    
181     
182         }  
183         
184         
185     
186