js檢測文字框是否為空程式碼例項

admin發表於2017-03-23
JS

本章節單獨介紹一下如何驗證一個文字框的內容是為空，這個在表單驗證功能中經常用到，下面就單獨剝離出來這一項功能，做一下詳細介紹，希望能夠對初學者能夠有所幫助。

程式碼如下:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>     
<html>     
<head>     
<meta charset=" utf-8">     
<meta name="author" content="http://www.softwhy.com/" />     
<title>螞蟻部落</title>    
<script type="text/javascript">
function checkBlankSpace(str){
  while(str.lastIndexOf(" ")>=0){
    str = str.replace(" ","");
  }
  if(str.length==0){
    alert("輸入內容不能為空");
  }
}
window.onload=function(){
  var obt=document.getElementById("bt");
   
  obt.onclick=function(){
    var str=document.getElementById("txt").value;
    checkBlankSpace(str);
  } 
}
</script>
</head>
<body>
<input type="text" id="txt"/>
<input type="button" id="bt" value="檢視結果"/>
</body>
</html>

以上程式碼實現了我們的要求，點選按鈕可以驗證文字框的內容是否為空，下面介紹一下它的實現過程。

一.程式碼註釋:

1.function checkBlankSpace(str){}，此函式可以檢測一個字串是否為空，引數是文字框的value值。

2.while(str.lastIndexOf(" ")>=0){str = str.replace(" ","");}，通過while迴圈語句來迴圈刪除字串的最後一個空格，這樣迴圈下來就可以將字串中的所有空格刪除。

3.if(str.length==0){alert("輸入內容不能為空");}，當刪除所有的空格之後，如果字串的長度為零，就可以斷定文字框中輸入的內容為空了，然後彈出提示。

二.相關閱讀:

1.lastIndexOf()函式可以參閱js lastIndexOf()一章節。

2.replace()函式可以參閱javascript replace()一章節。  

3.length屬性可以參閱javascript String length一章節。

相關文章