[英]Check if username already exists, no ajax or php, just pure js
這是代碼:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function submit()
{
var ul = document.getElementById("names");
var name = document.getElementById("name").value;
var i = 0, flag = 0;
var allNames = [];
if (allNames.length == 0)
{
allNames[0] = name;
}
else
{
if (allNames.includes(name))
{
alert("Name already exists.");
return -1;
}
else
{
allNames[i++] = name;
}
}
var li = document.createElement("li");
li.innerHTML = name;
ul.appendChild(li);
document.getElementById("name").value = "";
}
</script>
</head>
<body>
<input type="text" id="name">
<button onclick="submit()">Submit</button>
<div>
<h2>Usernames</h2>
<ul id="names"></ul>
</div>
</body>
</html>
有沒有辦法檢查用戶名是否已經存在並因此阻止新條目,僅使用 javascript?
我也嘗試過將數組的初始化移到 function 之外,但它也不起作用......
是的,只需在 function 之外聲明allNames
變量。 您當前每次調用提交 function 時都會使用空數組創建它。
您還有一個問題,因為您的i
每次都設置為 0。 如果不包含它,只需使用.push
(而不是嘗試指定索引)。
var allNames = []; function submit() { var ul = document.getElementById("names"); var name = document.getElementById("name").value; if (allNames.includes(name)) { alert("Name already exists."); return -1; } else { allNames.push(name); } var li = document.createElement("li"); li.innerHTML = name; ul.appendChild(li); document.getElementById("name").value = ""; }
<input type="text" id="name"> <button onclick="submit()">Submit</button> <div> <h2>Usernames</h2> <ul id="names"></ul> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.