初學者到JavaScript和HTML5(前一段時間學過,直到今天才使用它)。如何使用JavaScript檢查數組值與用戶輸入的值?
所以,我花了一些時間在網上尋找答案,但找不到我在找什麼(也許我失去了一些東西)。我遇到的問題是,如果需要,我創建了一個表單,要求用戶提供姓名,ID和電子郵件。現在,在現實世界中,ID和名稱將被存儲在數據庫中,用戶輸入數據將在數據庫中被檢查;但由於這是一個班級任務,我們被要求創建一個由三名學生組成的數組,以便根據用戶輸入數據進行檢查。
這是我的HTML5網站代碼:
<!DOCTYPE html>
<html lang = "en">
<head>
<title>Student Transaction Form</title>
<meta charset="UTF-8"/>
<style>
p {
color: red;
font-family: Times New Roman, serif;
font-size: 160%;
}
</style>
</head>
<body>
<div style="text-align:center;">
<FORM METHOD="POST" id="the-form" action="#" >
<TABLE BORDER="1" align = "center" >
<caption style="font-size:30px">Student Transaction Form</caption>
<TR>
<TD style="font-size:18px">Student Name:</TD>
<TD>
<INPUT TYPE="TEXT" required = "required" placeholder = "Input Name" NAME="name" SIZE="25">
</TD>
\t <TD style="font-size:18px"><p>Required</p></TD>
</TR>
<TR>
<TD style="font-size:18px">Student Number:</TD>
<TD><INPUT TYPE="TEXT" pattern=".{8,8}" required = "required" placeholder = "Input Number" NAME="number" SIZE="25"></TD>
\t <TD style="font-size:18px"><p>Required</p></TD>
</TR>
<TR>
<TD style="font-size:18px">Student Email:</TD>
<TD><INPUT TYPE="email" NAME="email" SIZE="25" ></TD>
\t <TD style="font-size:18px">
\t <script type="text/javascript">
function ShowHideDiv(chkEmail)
\t \t {
var dvEmail = document.getElementById("dvEmail");
dvEmail.style.display = chkEmail.checked ? "block" : "none";
}
\t </script>
\t
<div id="dvEmail" style="display: none">
<p>Required</p>
</div>
</TD>
</TR>
<TR>
<TD></TD>
<TD>
<form id = "form1">
<label for="chkEmail">
<input type="checkbox" id="chkEmail" onclick="ShowHideDiv(this)" />
Email me a transaction comfirmation
</label>
</form></TD>
</TR>
</TABLE>
<P><INPUT TYPE="SUBMIT" VALUE="Submit" NAME="B1"></P>
</FORM>
</body>
此刻的代碼只是確保密碼(ID)是有效的(有8個字符),如果該複選框被檢查,需要一封電子郵件。
所以,我的問題是:如何創建一個與學生姓名和身份證相互連接的數組(意思是如果姓名正確,但身份證是不同的人,它會標記爲不正確)以及如何運行用戶輸入數據檢查?
一個例子是,如果用戶在ID框中輸入Bill Smith
作爲名稱,59683471
在提交時會檢查是否存在ID爲59683471的Bill Smith;如果不是,則禁止提交。如果它們確實存在,那麼一切都很好,表單可以提交。
謝謝。
編輯:
功能:
<script type ="text/javascript">
function checkall(Submit)
{
var name = document.getElementById("studentName").value;
var id = document.getElementById("studentNumber").value;
\t var studentArray =
\t [
\t {"Name": "Thomas Livshits", "Id": "33138463"},
\t {"Name": "James Maro", "Id": "33138743"},
\t {"Name": "Bill Smith", "Id": "33138356"},
\t ];
studentArray.forEach(function(student){
if(id == student.Id && name == student.Name)
console.log("Found a match for student: " + student.Name);
});
}
</script>
並提交部分:
<P><INPUT TYPE="SUBMIT" id = "Submit" VALUE="Submit" NAME="B1" onsubmit = "checkall(this); return false;"></P>
謝謝,幫助我很多。 – Thomas