Question

我正在使用Jquery valdiation plugin来验证客户端的表单。但我想做验证，如。

<input type="text" id="txtInf" regex="/some regular expression/" error="Inf is mandatory"></inf>

此处正则表达式和错误是自定义属性。字段将根据正则表达式中的给定正则表达式进行验证，如果正则表达式文本失败，则应显示错误符号。

我尝试将此方法添加到验证程序。

 $("*[regex]").each(function () {

            $.validator.addMethod($(this).attr('id'), function () {
                return this.optional($(this)) || $(this).attr('regex').test($(this).text());
            }, $(this).attr('error'));

});

但是这个方法存在一些问题。如果我认为正确，请告诉我。如果您有其他想法，请告诉我。欢迎任何思考过程。

Answer 1

我没有使用过该插件，但看起来你会因使用test（）而出错。

$(this).attr('regex').test($(this).text());

应该是

var regEx = new RegExp($(this).attr('regex'));
regEx.test($(this).text());

Answer 2

引导程序中的自定义表单验证可以使用几行代码

//在html中添加以下代码

  <form id="addForm" action=" " method="post" class="needs-validation" novalidate> </form>

//在脚本标记中添加

(function() {
    'use strict';
    window.addEventListener('load', function() {
        // Fetch all the forms we want to apply custom Bootstrap validation styles to
        var forms = document.getElementsByClassName('needs-validation');
        // Loop over them and prevent submission
        var validation = Array.prototype.filter.call(forms, function(form) {
            document.getElementById("btn_inject").addEventListener("click", function(event) {
                //form.addEventListener('submit', function(event) {

                if (form.checkValidity() === false) {

                    event.preventDefault();
                    event.stopPropagation();
                }
                form.classList.add('was-validated');

            }, false);
        });
    }, false);
})
();

///您还需要使用它来使文本框变回关闭验证

 $("#Modalidname").on('hide.bs.modal', function() {
                $("#Formidname").removeClass('was-validated');

            });

使用jquery插件基于属性进行自定义表单验证

2 个答案: