javascript如何在不使用警报的情况下创建验证错误消息

jhs*_*546 8 javascript validation

我希望在用户名字段下显示一个简单的表单验证错误消息.

我似乎无法弄明白.

<form name ="myform" onsubmit="validation()">
     Username: <input type ="text" name="username" /><br />              
     <input type ="submit" value="submit" />
      <div id ="errors">
      </div>
</form>
Run Code Online (Sandbox Code Playgroud)

这是我的验证脚本:

function validation(){ 
    if(document.myform.username.value == ""){   //checking if the form is empty
         document.getElementById('errors').innerHTML="*Please enter a username*";
                //displaying a message if the form is empty
    }
Run Code Online (Sandbox Code Playgroud)

Zol*_*oth 12

如果发生错误,您需要停止提交:

HTML

<form name ="myform" onsubmit="return validation();"> 
Run Code Online (Sandbox Code Playgroud)

JS

if (document.myform.username.value == "") {
     document.getElementById('errors').innerHTML="*Please enter a username*";
     return false;
}
Run Code Online (Sandbox Code Playgroud)