前言:
對於用JS判斷Txt中是否為數字,在之前的一次驗證輸入年齡是否在0~100之間時,已經做了相應判斷。然而這次當想用同樣方法驗證輸入全為數字時,發現有一點問題,如下述:
初始做法:
先設定環境,一個Txt文本輸入框,一個提交Btn,並觸發驗證文字框中是否全為數字?見代碼(JS片段)
<head runat="server">
<title>驗證輸入Txt的內容全為數字</title>
<script type ="text/javascript" language ="javascript" >
// Description: 示範驗證Txt中內容是否全為數字
// CopyRight: http://www.cnblogs.com/yangmingming
// Notes: 應用一個Txt伺服器控制項,一個Btn控制項
function CheckTxt()
{
var elementTxt=document.getElementById ("txtCheck").value;
//應用parseInt函數,將字串(string類型)提取數字
if(parseInt (elementTxt )>0)
{
alert("true");
return true ;
}
else
{
alert("False");
return false ;
}
}
</script>
</head>
當輸入全為數字時,返回True;然而輸入為類似‘123abc’時,卻出現意外效果,見:
即這是parseInt函數,只是從中部分截取數字部分,這樣也就產生了如示的提示結果。怎麼辦呢?
修改做法:
可以用兩種方法分別實現,一種是用JS判斷;一種是用Regex判斷。分述之:
i)JS判斷:
用JS判斷,其中用到了string的方法應用(也是不甚熟悉的地方,呵呵)。先見代碼:
<title>驗證輸入Txt的內容全為數字</title>
<script type ="text/javascript" language ="javascript" >
// Description: 示範驗證Txt中內容是否全為數字
// CopyRight: http://www.cnblogs.com/yangmingming
// Notes: 應用一個Txt伺服器控制項,一個Btn控制項
function CheckTxt()
{
var elementTxt=document.getElementById ("txtCheck").value;
if(CheckDigit(elementTxt ))
{
alert ("True");
return true ;
}
else
{
alert ("False");
return false ;
}
}
//輔助函數,驗證傳入函數的字串是否全為數字
function CheckDigit(str)
{
var letters="0123456789";
for(var i=0;i<str.length;i++)
{
if(letters.indexOf (str[i])==-1)
return false;
}
return true ;
}
</script>
</head>
這樣產生的調試結果,即為正確的了。示:
即我們得到正確的結果了,呵呵~
ii)Regex判斷:
關於Regex,前已概述,在此做一驗證,見代碼:
<head runat="server">
<title>驗證輸入Txt的內容全為數字</title>
<script type ="text/javascript" language ="javascript" >
// Description: 示範驗證Txt中內容是否全為數字
// CopyRight: http://www.cnblogs.com/yangmingming
// Notes: 應用一個Txt伺服器控制項,一個Btn控制項
function CheckTxt()
{
var regExp=/^\d+(\.\d+)?$/;
var elementTxt=document.getElementById ("txtCheck").value;
if(regExp .test (elementTxt ))
{
alert ("True");
return true ;
}
else
{
alert ("False");
return false ;
}
}
</script>
</head>
通過Regex驗證,其結果同用JS的判斷。
綜述之,通過對驗證是否為數字,進一步加深了對JS的理解,以後有機會會進一步鞏固之,呵呵~