清除表单上的 jquery 个验证图标

Question

我需要在单击菜单中的幻灯片外部时清除所有验证错误消息和验证图标。

但是虽然表单重置和错误信息都被删除了，但是叉号没有变。当我在菜单外单击时，我需要删除所有数据。

我正在使用以下代码重置表单并删除验证消息。

<script>
  $('.overlay').on('click', function(){    
     $("#ohut-innate-form")[0].reset();    
     $('#navbarSide').removeClass('reveal');
     $('.overlay').hide();
     $(".error").html('');
     $(".error").removeClass("error");
     $("ohut-innate-form").validate().resetForm();   
  });
</script>

这是我的表格

<form class="ohut-innate-form" id="ohut-innate-form" name="ohut-innate-form" method="post">
                        <span class="form-group">
                        <label >Email Address</label>
                        <input type="email" name="emailReg" id="emailReg" class="validate" required>
                        </span>
                        <span class="form-group">
                        <label>Password</label>
                        <input type="password" name="passwordReg" id="passwordReg" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Confirm Password</label>
                        <input type="password" name="cpassword" id="cpassword" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Name</label>
                        <input type="text"  name="name" id="name" class="validate">
                        </span>
                        <span class="form-group">
                        <label>Contact Number</label>
                        <input type="text" name="contact" id="contact" class="validate">
                        </span>
                        <input type="hidden" id="baseUrlReg" value="<?php echo base_url(); ?>">
                        <button type="submit" id="submit" class="btn  btn-block btn-primary mr-2" name="Login">Register</button>
                       <!-- <a href="#"  name="Login"  id="register_user" onclick="registerUser()" class="btn  btn-block btn-primary mr-2">Register</a> -->

                        <div class="formrow left" style="visibility: hidden;">
                            <div class="mainlableContent">
                                <input class="formtext" type="text" name="mid" id="mid" value="<?php echo $merchantid; ?>" >
                                <span class="glyphicon glyphicon-remove right errorcross" id="email_cross" style=""></span>
                            </div>
                        </div>
                    </form>

如何去掉红叉？

Answer 1

不确定这是否是您要查找的内容，但由于您标记了 jQuery，您可以使用 $(window).click(function(){ }); 来注册元素外部的点击，然后围绕它应用逻辑。您可以通过 class、名称或 ID 来定位您的元素，具体取决于最方便的方式。

此外，当你退出一个元素时，你是想清除验证消息并隐藏所有元素的交叉，还是只隐藏你退出的那个？

略读您的代码，我认为最好的解决方案是在清除所有消息等方面按照您在不同元素上的 classes 进行操作。

例如：

$(window).click(function() {
    $(".error").html(''); //this is your validation/error message that will be cleared
    $('.right errorcross').hide(); //this is your red cross that will be hidden
});

请注意，这是半伪代码，这意味着您必须调整它以符合您的逻辑，主要是因为我不知道您的 classes 具体做什么，因为没有代码它们已在您的问题中提供。

清除表单上的 jquery 个验证图标

Clear jquery validation icons on form

jquery

forms

validation

reset