在html表单中错误消息/提示的正确位置

时间:2014-04-22 04:47:26

标签: javascript html forms

我有一个简单的标准表单,我打算使用javascript的

document.getElementById("idname").innerHTML = "hint/error message";

更改/显示表单上的错误消息。

将错误消息放在表单上的适当位置在哪里?

内部标签?标签旁边?

我把它放在div或span中吗?

(我希望错误信息显示在输入字段的右侧。)

以下是我的表格:

<form id="registerForm" method="POST" action="register_post.php">

  <p class="form-registerUserName">
    <label for="registerUserName">User Name</label>
    <span class="required">*</span>
    <input
        id="registerUserName"
        name="registerUserName"
        type="text"
        size="24"
        maxlength="24"
        value="<?php echo $_SESSION['registerUserName'];?>"
        onkeyup="validateName()"
        onblur="validateName()"
     >
   </p>
</form>

提前致谢。

2 个答案:

答案 0 :(得分:4)

您可以在Div上显示错误MSG以进行验证,以便您可以使用javascript轻松管理div show / hide。

例如

<div class="error" style="display: none; float:left; width:100%;" id="nameError">Please Enter User Name *</div>
<div><input type="text" id="username" name='username' class="textcss validate" style="width:95%"  placeholder="Your name can not be blank" ></div>

现在检查提交是否填写,并显示和隐藏错误div,以便css以正确的形式

答案 1 :(得分:0)

通常情况下,如果您使用div作为包装并在标签中包含错误消息,并将其放在输入框旁边。

说:              用户名         *         “             的onkeyup = “validateName()”             的onblur = “validateName()”          &GT;               

<强> CSS

input{
    display: inline-block;
}
label.error_msg{
    display: none;
    color: red;
}