Question

我正在验证隐藏字段。当我提交空白条目时，它会验证但是消息会在表单的顶部。我试图向其标签字段显示此消息，但未获得成功。

这是代码。

    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
    <form method="GET" action="#" style="margin-top: 100px; margin-left: 100px;">
    <label for="test123">Name : </label>
    <input type="text" style="display: none;" value="" required="" name="test123" id="test123">
    <button type="submit"> Submit</button>
    </form>
    <script type="text/javascript">
    $("label[for='test123']").click(function(){
        $("#test123").css('display','block');
    });
    </script>

点击名称标签后会出现输入框。

Answer 1

不要隐藏它，只是将其不透明度设置为0。

$('#test123').css('opacity','0');

并再次展示：

$('#test123').css('opacity','1');

Answer 2

使用jQuery的 .append（）将错误消息附加到您想要的输入字段旁边的DOM中。

$("form").on("submit", function(){
if(!isValid()){
var html = "<div style='color:#D50000'>Error</div>";
 $("#test123").append(html).show(); //show() to show the input element
}
});

的SideNote ：使用Happy.js，它是一个非常轻量级，易于使用的验证插件，可以解决您的问题。

如何验证隐藏的输入字段

2 个答案: