javascript - 如何使用 JAVASCRIPT 检查 HTML 表单的输入并在现场打印错误消息？

Question

<script>
function validate(){
u=document.CustomerLogin.UserName.value;
p=document.CustomerLogin.Password.value;
rp=document.CustomerLogin.RePassword.value;

if (u==""){
 document.write("Enter a unique username");
 return false;
 }
if (p!=rp){
 document.write("Retype Password Incorrect");
 return false;
 }
return true;
}
</script>

消息打印在单独的页面上，但我希望它们打印在文本框前面的同一位置！请帮忙。谢谢！

Answer 1

永远不要使用 Document write，它很危险......

document.getElementById("anidofanElementinthePage").innerHTML = " 要通过 javascript 添加的字符串";

<script>
function validate(){
u=document.CustomerLogin.UserName.value;
p=document.CustomerLogin.Password.value;
rp=document.CustomerLogin.RePassword.value;

if (u==""){
  document.getElementById("theIdOfyourTextBlocInForm").innerHTML = "Enter a unique username";
 return false;
 }
if (p!=rp){
 document.getElementById("theIdOfyourTextBlocInForm").innerHTML = "Retype Password Incorrect";
 return false;
 }
return true;
}
</script>

Answer 2

您需要检测文本更改。一种方法是使用它：

<input name="blah" onchange="validate()" ... />

编辑 要在同一页面上添加文本，请使用脚本包含脚本<script src=...>，然后<div id='validation[i]'></div>在每个输入旁边添加，其中每次[i]增加 1（因此 validation1 validation2 依此类推）。然后，使用getElementById('validation[i]').innerHtml更改值。

Answer 3

document.write 只会将消息附加到页面的末尾。最简单的解决方案是将其更改为这样的警报：

if (u==""){
 alert("Enter a unique username");
 return false;
}

否则，您将需要创建新的 DOM 元素（在手之前或检测到错误时）以保存消息并将它们放置在输入旁边