说明:包含Javascript,CSS,页面设计,我会把一些需要分享的内容不定期更新到这个帖子中,整理到够一次培训的时候再做整体培训
1) 客户端string连接方法,对于大数据量的字符串连接不要直接适用“+=”的方式,而要改用数组去实现,这样效率会高出很多倍,具体实现如下
——————
1 var strHtml = "<input type='text' value='' />";
2 var strArr = [];
3 for( var i = 0; i> 1000; i++){
4 strArr[i] = strHtml;
5 }
6 $( "testDiv").innerHTML = strArr.join( '').toString();
1 var strHtml = "<input type='text' value='' />";
2 var strArr = [];
3 for( var i = 0; i> 1000; i++){
4 strArr[i] = strHtml;
5 }
6 $( "testDiv").innerHTML = strArr.join( '').toString();
2)对于web系统表单验证 输入限制一直是一个非常繁琐的问题,提供一段非常有意思的代码,发挥你的想象力,或许可以得出更多的方案
————————
01<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
02<html>
03<head>
04 <script type= "text/javascript">
05 //inputControl v 1.00
06 inputControl={
07 rules:{},
08 addRules: function(formName,controlObj){
09 this.rules[formName]=controlObj;
10 this.init(formName);
11 },
12 init: function(formName){
13 if(!document || !document.forms || !document.forms[formName]){
14 setTimeout( 'inputControl.init("'+formName+ '")', 200);
15 return;
16 };
17 var f=document.forms[formName];
18 var r= this.rules[formName];
19 for( var i in r){
20 var e=f.elements[i];
21 if(!e){ continue};
22 if(e.type!= "text" && e.type!= "textarea"){ continue};
23 e.οnkeypress= function(e){
24 var key=window.event?event.keyCode:e.which;
25 if(key< 13){ return true};
26 var keychar=String.fromCharCode(key);
27 var reg= new RegExp(r[ this.name]);
28 return reg.test(keychar)
29 }
30 }
31 }
32 }
33
34 </script>
35 <script type= "text/javascript">
36 addSomeRules= function(){
37 inputControl.addRules(
38 "myForm",
39 {
40 "alphas" : "[a-zA-ZüÜéè]",
41 "numerics" : "[0-9/.]"
42 }
43 )
44 }
45 afterAllOnLoad= function(){
46 alert( "test");
47 if(!window[ "Safari"]){
48 addSomeRules()
49 }
50 else {
51 setTimeout( "addSomeRules()", 1000)
52 }
53 }
54 </script>
55</head>
56<body>
57
58 <form class= "treb" name= "myForm" style= "margin:0px">
59 除数字外: <br /><input type="text" name="alphas"><br/>
60 只有数字:<br/><input type= "text" name= "numerics">
61 </form>
62 <script>
63 afterAllOnLoad();
64 </script>
65</body>
66</html>
01<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
02<html>
03<head>
04 <script type= "text/javascript">
05 //inputControl v 1.00
06 inputControl={
07 rules:{},
08 addRules: function(formName,controlObj){
09 this.rules[formName]=controlObj;
10 this.init(formName);
11 },
12 init: function(formName){
13 if(!document || !document.forms || !document.forms[formName]){
14 setTimeout( 'inputControl.init("'+formName+ '")', 200);
15 return;
16 };
17 var f=document.forms[formName];
18 var r= this.rules[formName];
19 for( var i in r){
20 var e=f.elements[i];
21 if(!e){ continue};
22 if(e.type!= "text" && e.type!= "textarea"){ continue};
23 e.οnkeypress= function(e){
24 var key=window.event?event.keyCode:e.which;
25 if(key< 13){ return true};
26 var keychar=String.fromCharCode(key);
27 var reg= new RegExp(r[ this.name]);
28 return reg.test(keychar)
29 }
30 }
31 }
32 }
33
34 </script>
35 <script type= "text/javascript">
36 addSomeRules= function(){
37 inputControl.addRules(
38 "myForm",
39 {
40 "alphas" : "[a-zA-ZüÜéè]",
41 "numerics" : "[0-9/.]"
42 }
43 )
44 }
45 afterAllOnLoad= function(){
46 alert( "test");
47 if(!window[ "Safari"]){
48 addSomeRules()
49 }
50 else {
51 setTimeout( "addSomeRules()", 1000)
52 }
53 }
54 </script>
55</head>
56<body>
57
58 <form class= "treb" name= "myForm" style= "margin:0px">
59 除数字外: <br /><input type="text" name="alphas"><br/>
60 只有数字:<br/><input type= "text" name= "numerics">
61 </form>
62 <script>
63 afterAllOnLoad();
64 </script>
65</body>
66</html>
这段代码并不够完善,想想看,还有什么地方可以改进?