(我會慢慢總結 這些以後 直接參考 不必百度谷歌 否則你一旦離開了百度谷歌 你啥都不是!) 知識擴展 Number()函數可以替代IsNaN()函數做是否非數字驗證,但是Number()返回NaN,IsNaN()返回boolean值。 有時候做字元串非空驗證可以用 “” 也可判斷Length是否為0
引言:本次只做一次javascript方面的知識梳理,決定以代碼化的方式直接展示!
(我會慢慢總結 這些以後 直接參考 不必百度谷歌 否則你一旦離開了百度谷歌 你啥都不是!)
1 模塊一 2 <script type="text/javascript"> 3 $(function () { 4 //非boolean值與boolean進行相加,得出數值var $num = 3;var $bol = true; 5 //字元串與數字相加 6 var $str = "2";//alert($num+$str);//“32” 不會報錯 進行字元串拼接 7 //alert(null.x);//TypeError: null has no properties 8 //alert(hellow(x)); 9 //ReferenceError: hellow is not defined//alert($num + $bol); 10 //4 隱士轉換 不會報錯(只有調用未存在的函數或者null.XXX才會報錯) 11 //NaN判斷 12 var $nan = NaN; 13 //alert($nan === NaN); 14 //false (隱士轉化會將 null轉為0,undefined轉為NaN) 15 //判斷值是否等於NaN (由於精度的不同導致了IsNaN判斷標準不同,利用IsNaN判斷是否為數字不太嚴謹) 16 //alert(isNaN("x")); 17 //true 18 //alert(isNaN(undefined)); 19 //true 20 //alert(isNaN({})); 21 //true 22 //替代IsNaN()判斷的方式 !== 23 //var b = "fl"; 24 //alert($num !== $nan); 25 //true 26 //alert(IsReallyNaN(b)); 27 //false 28 //alert(IsReallyNaN(undefined)); 29 //false 30 //重寫IsNaN()function IsReallyNaN(x) {return x !== x;} 31 //對象轉字元串用tostring,轉數字用valueOf 32 var obj = {toString: function () {return "j" + $str.toString();},valueOf: function () {return 4 + $num;}} 33 alert(obj.toString() + "" + obj.valueOf());//j2 7 34 //判斷值是否等於undefined (忽略了0和-0) 35 //function hello(x) {// if (!x) {// x = 11111;// } 36 // return {x:x};//} 37 //console.log(hello(-0));//1111 38 //替代邏輯運算符判斷undefined的方法 typeof 39 function hellos(x) { 40 //if (typeof x==="undefined") { 41 // x = 11111; 42 //}if (x === undefined) {//不要用 x=='undefined',推薦使用===x = 11111;}//對於確定的類型判斷,可以加上parseInt()更嚴謹if (parseInt(x) === undefined) {x = 1;}return { x: x };} 43 console.log(hellos()); 44 //1111 45 console.log(hellos(-0));//0 46 }); 47 48 49 50 模塊二 51 <script type="text/javascript"> 52 $(function () { 53 $('#btn_load').click(function () { 54 //$('.content').load('/testscript/hello', function () { });//將請求的頁面填充到div中 55 //$.getJSON('/testscript/tojson', function (data) {//從伺服器端獲取json// //遍歷json文件// $.each(data, function (i, value) {// //...// });//}); 56 //$.getScript('/testscript/tojs', function () {//從伺服器端獲取JS// //...//}); 57 //全局Ajax$.ajaxSetup({}); 58 //在請求伺服器之前需要做的事 59 $('.content').ajaxStart(function () { $(this).hide() }); 60 //在請求伺服器結束需要做的事 61 $('.content').ajaxStop(function () { $(this).show(); }); 62 //序列化編碼後的表單元素的值 63 alert($('#frm').serialize());}); 64 //取值按鈕$('#btn').click(function () { 65 //獲取當前select標簽的值 66 alert($('#sel').val()); 67 //獲取選中select的文本 68 alert($('#sel option:selected').text()); 69 //獲取當前checkbox選擇狀態 70 $('[name=chk]:checked').each(function () { 71 alert($(this).val()); 72 alert($(this).attr("data-IsTrue"));}); 73 //獲取當前選中redio標簽的值 74 alert($(':radio[name=rdo]:checked').val()); 75 $(':radio[name=rdo]').eq(0).prop("checked", true);//預設選擇第一個 76 //獲取文本域的值alert($.trim($('#are').val()));}); 77 //是否全選按鈕$('#chkAll').click(function () { 78 //全選 反選 79 $('#chkAll').toggle(function () {$('[name=chk]').prop('checked', true);}, function () {$('[name=chk]').prop('checked', false);}); 80 //不建議用toggle,會與jq的狀態衝突 81 if ($(this).prop("checked")) {$('[name=chk]').prop("checked", true);} 82 else {$('[name=chk]').prop("checked", false);}});}); 83 </script> </span>
知識擴展
Number()函數可以替代IsNaN()函數做是否非數字驗證,但是Number()返回NaN,IsNaN()返回boolean值。
有時候做字元串非空驗證可以用===“” 也可判斷Length是否為0,但是前提必須做好Trim()去空格處理,空格也會占用一個字元位置。
1 1.判斷字元串輸入字元長度函數(unicode碼) 2 var validate={ 3 //判斷字元記憶體中實際長度 4 GetStrLength:function GetStrLength(value){ 5 var len=0; 6 for(var i=0; i<value.length; i++){ 7 var a=value.charAt(i); 8 if(a.match(/[^\x00-\xff]/ig) !=null){ 9 len+=2;//漢字 10 }else{ 11 len+=1;//數字 12 } 13 return len;//返回字元長度 14 } 15 } 16 } 17 18 19 2.文本框中只允許限制數字輸入 20 代碼嵌入式<input type="text" onkeyup="this.value='this.value.replace(/\D/g,'')'"> <input type="text" onafterpaste="this.value='this.value.replace(/\D/g,'')'"> 21 函數封裝 <input type="text" data-type="print"> 22 $('input[data-type=print]').keyup(function(){ 23 var source=$(this).val(); 24 source=source.replace(/[^\d]*/g,'').replace(/\b(0+)/gi,'');//過濾中文和特殊字元 25 $(this).val(source); 26 }); 27 28 29 3.驗證是否輸入了正確的url(http or https) 30 $('#txtLinkAddress').blur(function(){ 31 var address_str=$.trim($(this).val()); 32 var reg=/^(http|https):\/\/([a-zA-Z\d][a-zA-Z\d-_]+\.)+[a-zA-Z\d-_][^ ]*$/; 33 if(reg.test(address_str)){ 34 //友好提示..... 35 } 36 }); 37 38 39 4.正則判斷NULL OR NaN 40 function isNullOrNaN(value){ 41 var flag=false; 42 var reg=/^([1-9]|[1-9][0-9]+)?$/; 43 if(reg.test(value)){ 44 flag=true; 45 return flag; 46 } 47 }
未完待續...