JQuery验证errorClass

Question

在我的JQuery验证遇到一些跨浏览器问题后，我已将其缩小到IE8不喜欢我使用的事实：

errorElement: 'validation-error',

我想要实现的只是验证错误直接出现在同一行的输入框之后。我在互联网上尝试了很多例子，而我最接近的就是：

错误标签直接显示在输入框之后，但输入框中的文本也正在应用错误的css（这在正确输入时消失）。我只是想在应用正确的css类时出现错误，而不是输入到输入框中的实际文本！

我的代码如下：

JS

$(function() {
            $( "#loginform" ).validate({
                errorClass: 'validation-error'
                ,errorElement:'span'
                ,rules: {
                    text_user_id: {
                        required: true,
                        minlength: 4,
                        maxlength: 20
                    }
                    ,text_password: {
                        required: true,
                        minlength: 8,
                        maxlength: 20
                    }
               }
               ,messages: {
                    text_user_id: {
                        required: "Please enter a User ID",
                        minlength: $.format("At least {0} characters required!"),
                        maxlength: $.format("Maximum of {0} characters allowed!")
                    }
                    ,text_password: {
                        required: "Please enter a Password",
                        minlength: $.format("At least {0} characters required!"),
                        maxlength: $.format("Maximum of {0} characters allowed!")
                    }
                }
            });
        });

CSS

.validation-error {
float: none; 
color: #FF0000;
padding-left: 5px; 
vertical-align: top; 

}

HTML（表单）

<form id="loginform" class="login-form" method="post" action="process_login.php">

<div id="login_form-error">
    <?php
        if (isset($_GET['error']))
        {
            echo $_GET['error'];
        }
    ?>
</div>

<div>
    <label>User ID:</label>
    <input id="text_user_id" name="text_user_id" type="text" onkeyup="user_id_change()"/>
</div>
<div>
    <label>Password:</label>
    <input id="text_password" name="text_password" type="password" onkeyup="password_change()"/>
</div>
<div class="login-form-buttons">
    <input type="submit" value="Login"/>
</div>

非常感谢任何帮助。

请参阅下面的图片，显示除了错误之外应用于输入框文本的css，并且在没有错误时直接在下面输入文本恢复为默认值。总结我希望输入框文本不受验证错误的影响。

由于