Jquery 验证在IE11和Edge中不起作用_Jquery_Jquery Validate

Jquery 验证在IE11和Edge中不起作用

jquery

Jquery 验证在IE11和Edge中不起作用,jquery,jquery-validate,Jquery,Jquery Validate,我在开发网站时使用了Chrome进行调试，jQuery验证工作成功。但是，它不适用于IE11和Edge。我不知道是什么问题。我使用了最新版本的jQuery，来自CDN的jQuery.validate，并使用“flask”（Python），jinja2 web模板对服务器进行了编程。是什么导致了问题下面是源代码的简化示例： <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.1.min.js">

我在开发网站时使用了Chrome进行调试，jQuery验证工作成功。但是，它不适用于IE11和Edge。我不知道是什么问题。我使用了最新版本的jQuery，来自CDN的jQuery.validate，并使用“flask”（Python），jinja2 web模板对服务器进行了编程。是什么导致了问题

下面是源代码的简化示例：

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.1.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/additional-methods.min.js"></script>
<script type="text/javascript">
    $.validator.setDefaults({
        onkeyup:false,
        onclick:false,
        onfocusout:false,
        showErrors:function(errorMap, errorList){
            if(this.numberOfInvalids()) {
                $(errorList[0].element).focus();
                errorList[0].element.setCustomValidity(errorList[0].message);
                errorList[0].element.addEventListener('invalid', function(){}, true);
                errorList[0].element.reportValidity();
            }
        }
    });

    $("#signup").validate({
        rules:{
            id:{required:true, rangelength:[5,10]},
            pwd:{required:true, rangelength:[5,15]},
            pwdConfirm:{required:true, equalTo:"#pwd"}
        },
        messages:{
            id:{
                required:"msg...",
                rangelength:"msg..."
            },
            pwd:{
                required:"msg...",
                rangelength:"msg..."
            },
            pwdConfirm:{
                required:"msg...",
                equalTo:"msg..."
            }
        }
    });
</script>

<form class="uk-form uk-form-stacked" id="signup" role="form" name="signup" method="post" action="{{url_for('signup')}}" autocomplete="off">
    <input name="id" id="id" type="text" placeholder="Please enter username">
    <input name="pwd" id="pwd" type="password" placeholder="Please enter password">
    <input name="pwdConfirm" id="pwdConfirm" type="password" placeholder="Please confirm password">
</form>


$.validator.setDefaults({
onkeyup:false，
onclick:false，
onfocusout:false，
错误：功能（错误映射、错误列表）{
if（this.numberOfInvalids（））{
$（错误列表[0]。元素）。焦点（）；
errorList[0]。元素。setCustomValidity（errorList[0]。消息）；
errorList[0]。元素。addEventListener（'invalid'，function（）{}，true）；
errorList[0]。元素。reportValidity（）；
}
}
});
$（“#注册”）.validate({
规则：{
id:{required:true，rangelength:[5,10]}，
pwd:{必需：true，rangelength:[5,15]}，
pwdConfirm:{必需：true，等于：#pwd}
},
信息：{
身份证：{
必需：“msg…”，
rangelength:“msg…”
},
pwd：{
必需：“msg…”，
rangelength:“msg…”
},
pwdConfirm：{
必需：“msg…”，
“味精…”
}
}
});

编辑部1，这是我在JSFIDLE中的代码

但即使在Chrome中也不起作用，我不知道问题出在哪里

所以，我试着在下一个环节进行测试

首先，我删除了w3shools示例代码，然后将源代码复制并粘贴到文本区域。它可以在Chrome中使用，但在Explorer和Edge浏览器中仍然无法使用

edit2，我找到了，

我认为这个问题是由于reportValidity（），它不支持除chrome以外的其他浏览器

所以我想知道这个reportValidity函数取代了什么。

点击

f12

，看看这个版本的IE是否真的没有在

7,8

上被模仿。仅供参考-根据官方网站，jQuery验证插件只在jQuery 1.11.1版之前进行过测试-试试看是否有什么不同。@Jai，OP从未提到过使用仿真或版本7、8。但是，OP应该知道Explorer的“兼容性模式”不是真正的浏览器模拟。。。这只是对不充分的、不是最新的代码的回退。请注意，

reportValidity（）

与jQuery验证插件完全无关。既然您使用的是jQuery Validate，它包含了一系列有用的方法，并且保证可以跨浏览器工作，那么为什么您要使用一些仅在Chrome中支持的晦涩难懂的JavaScript方法？@Sparky-晦涩难懂的JavaScript方法？这一切都是颠倒过来的——既然jQuery是现行HTML5标准的一部分，为什么还要使用jQuery进行表单验证呢？而且它很难“仅在Chrome中受支持”-点击

f12

，看看这个版本的IE是否真的没有在

7,8

reportValidity（）