用於檢查字段是否為空的Javascript函數
[英]Javascript function to check whether a field is empty or not
問題描述
以下功能可用於檢查用戶是否在給定字段中輸入了任何內容。 空白字段可以表示兩種值。 長度為零的字符串或NULL值。
function required() { var empt = document.forms["form"]["text"].value; if (empt == "") { alert("Please input a Value"); return false; } else { alert('Code has accepted : you can try another'); return true; } }
li {list-style-type: none; font-size: 16pt; } .mail { margin: auto; padding-top: 10px; padding-bottom: 10px; width: 400px; background : #D8F1F8; border: 1px soild silver; } .mail h2 { margin-left: 38px; } input { font-size: 20pt; } input:focus, textarea:focus{ background-color: lightyellow; } input submit { font-size: 12pt; } .rq { color: #FF0000; font-size: 10pt; }
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript form validation - checking non-empty</title> <link rel='stylesheet' href='form-style.css' type='text/css' /> </head> <body> <div class="mail"> <h2>Input your Name and Submit</h2> <form name="form1" action="#" onsubmit="required()"> <ul> <li><input type='text' name ='text1'/></li> <li class="rq">*Required Field</li> <li><input type="submit" name="submit" value="Submit" /></li> </ul> </form> </div> <script src="non-empty.js"></script> </body> </html>
我正在嘗試此代碼，但無法運行腳本。 我也使用jquery.js，如果有幫助
我怎么解決這個問題？
4 個解決方案
解決方案1
1 2017-08-14 12:44:20
您的表單和文本字段的名稱在javascript中錯誤。 我已在以下代碼段中對此進行了更正。
僅一行“ var empt = document.forms [“ form1”] [“ text1”]。value;“ 改變。
function required() { var empt = document.forms["form1"]["text1"].value; if (empt == "") { alert("Please input a Value"); return false; } else { alert('Code has accepted : you can try another'); return true; } }
li {list-style-type: none; font-size: 16pt; } .mail { margin: auto; padding-top: 10px; padding-bottom: 10px; width: 400px; background : #D8F1F8; border: 1px soild silver; } .mail h2 { margin-left: 38px; } input { font-size: 20pt; } input:focus, textarea:focus{ background-color: lightyellow; } input submit { font-size: 12pt; } .rq { color: #FF0000; font-size: 10pt; }
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript form validation - checking non-empty</title> <link rel='stylesheet' href='form-style.css' type='text/css' /> </head> <body> <div class="mail"> <h2>Input your Name and Submit</h2> <form name="form1" action="#" onsubmit="required()"> <ul> <li><input type='text' name ='text1'/></li> <li class="rq">*Required Field</li> <li><input type="submit" name="submit" value="Submit" /></li> </ul> </form> </div> <script src="non-empty.js"></script> </body> </html>
解決方案2
0 2017-08-14 12:43:39
由於您提到您正在使用jQuery，因此這里是一個有效的示例：
function required(e) { //e.preventDefault(); var empt = $("#text1").val(); if (empt == "") { alert("Please input a Value"); return false; } else { alert('Code has accepted : you can try another'); return true; } }
li { list-style-type: none; font-size: 16pt; } .mail { margin: auto; padding-top: 10px; padding-bottom: 10px; width: 400px; background: #D8F1F8; border: 1px soild silver; } .mail h2 { margin-left: 38px; } input { font-size: 20pt; } input:focus, textarea:focus { background-color: lightyellow; } input submit { font-size: 12pt; } .rq { color: #FF0000; font-size: 10pt; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript form validation - checking non-empty</title> <link rel='stylesheet' href='form-style.css' type='text/css' /> </head> <body> <div class="mail"> <h2>Input your Name and Submit</h2> <form name="form1" action="#" onsubmit="required()"> <ul> <li><input type='text' id="text1" name='text1' /></li> <li class="rq">*Required Field</li> <li><input type="submit" name="submit" value="Submit" /></li> </ul> </form> </div> <script src="non-empty.js"></script> </body> </html>
唯一的變化是，向文本字段添加ID，並使用jQuery捕獲值。
希望這可以幫助！
解決方案3
0 2017-08-14 12:51:19
在您的文本字段中添加一個“ id” ID，並在“提交”按鈕中“提交”。
$('#submit').click(function(){
if($('#id').val()){
alert('Code has accepted : you can try another');
return true;
}else{
` alert('Enter Text');
return false;
}
})
解決方案4
0 2017-08-14 13:04:21
它簡單地將id作為txtInput添加到您的輸入類型，並獲得其值，例如
document.getElementById('txtInput').value;
function required() { var empt = document.getElementById('txtInput').value; if (empt == "") { alert("Please input a Value"); return false; } else { alert('Code has accepted : you can try another'); return true; } }
li {list-style-type: none; font-size: 16pt; } .mail { margin: auto; padding-top: 10px; padding-bottom: 10px; width: 400px; background : #D8F1F8; border: 1px soild silver; } .mail h2 { margin-left: 38px; } input { font-size: 20pt; } input:focus, textarea:focus{ background-color: lightyellow; } input submit { font-size: 12pt; } .rq { color: #FF0000; font-size: 10pt; }
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>JavaScript form validation - checking non-empty</title> <link rel='stylesheet' href='form-style.css' type='text/css' /> </head> <body> <div class="mail"> <h2>Input your Name and Submit</h2> <form name="form1" action="#" onsubmit="required()"> <ul> <li><input type='text' id="txtInput" name ='text1'/></li> <li class="rq">*Required Field</li> <li><input type="submit" name="submit" value="Submit" /></li> </ul> </form> </div> <script src="non-empty.js"></script> </body> </html>
javascript中的Ajax函數無法檢查XML是否為空？
[英]Ajax function in javascript can not check whether the XML is empty?
.length是否不是檢查Javascript中數組是否為空的正確方法？
[英]Is not `.length` the right way to check whether an array is empty or not in Javascript?
如何使用 JQuery/Javascript 檢查選擇框是否為空
[英]How to check whether a select box is empty using JQuery/Javascript
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.