在步骤更改检查文件大小和文件类型jquery -步骤

On step changing check file size and file type Jquery-Steps

本文关键字：文件 类型 jquery -步骤 文件大小 检查      更新时间：2023-09-26

我使用jquery-steps插件。现在我试图检查文件扩展名是否为。jpg。除了文件类型检查之外，一切都很好。它接受一切，但不应该

$("#passportForm").steps({
         headerTag: "h1",
         bodyTag: "fieldset",
         enableFinishButton: false,
         transitionEffect: "fade",
         stepsOrientation: "vertical",
         onStepChanging: function (event, currentIndex, newIndex) {
             // Always allow going backward even if the current step contains invalid fields!
             if (currentIndex > newIndex) {
                 return true;
             }
             var form = $(this);
             // Clean up if user went backward before
             if (currentIndex < newIndex) {
                 // To remove error styles
                 $(".body:eq(" + newIndex + ") label.error", form).remove();
                 $(".body:eq(" + newIndex + ") .error", form).removeClass("error");
             }
             // Disable validation on fields that are disabled or hidden.
             form.validate({
                 rules: {field: {required: true,extension: "jpeg|jpg"}}***,
                 errorPlacement: function (error, element) { }
             }).settings.ignore = ":disabled,:hidden";
             // Start validation; Prevent going forward if false
             return form.valid();
         },
         onStepChanged: function (event, currentIndex, priorIndex) {
         },
         onFinishing: function (event, currentIndex) {
             var form = $(this);
             // Disable validation on fields that are disabled.
             // At this point it's recommended to do an overall check (mean ignoring only disabled fields)
             form.validate({ errorPlacement: function (error, element) { } }).settings.ignore = ":disabled";
             // Start validation; Prevent form submission if false
             return form.valid();
         },
         onFinished: function (event, currentIndex) {
             var form = $(this);
             form.submit();
         }
     });

我还需要检查文件大小。它必须小于3mb。第三个问题是，当我们点击快速NEXT按钮，它传递到下一步没有验证

你的方法(使用jQuery Validate插件)是完全有缺陷的....

$("#passportForm").steps({
    ....
    onStepChanging: function (event, currentIndex, newIndex) {
         ....
         var form = $(this);
         ....
         // Disable validation on fields that are disabled or hidden.
         form.validate({
             rules: {field: {required: true,extension: "jpeg|jpg"}}***,
             errorPlacement: function (error, element) { }
         }).settings.ignore = ":disabled,:hidden";
         // Start validation; Prevent going forward if false
         return form.valid();
     },
     ....
     onFinishing: function (event, currentIndex) {
         var form = $(this);
         // Disable validation on fields that are disabled.
         // At this point it's recommended to do an overall check (mean ignoring only disabled fields)
         form.validate({ errorPlacement: function (error, element) { } }).settings.ignore = ":disabled";
         // Start validation; Prevent form submission if false
         return form.valid();
     },
     ....
 });

你不能在你想要的时候用一组新的选项简单地调用.validate()。

根据你的代码注释，似乎你也可能认为你调用validate()来触发需求验证…不是这样的。

.validate()方法只用于初始化插件在你的表单一次页面加载。一旦调用(并初始化)，任何后续对.validate()方法的调用都将被忽略。

如果你有一个已经用.validate()初始化的表单，你可以在任何时候调用.valid()方法来触发验证测试。

如果你需要"开始/停止"或切换验证，你不能。但是，您可以通过使用.rules()方法来模拟类似的事情。可以在所有input元素上调用.rules('remove')以删除所有验证规则，从而有效地删除任何验证检查。然后，可以在任何input元素上调用.rules('add', { /* your rules */ })以将规则放回原位，从而有效地再次允许验证。

尽管允许添加/删除规则，但一旦调用.validate()初始化，您绝对不能添加/删除/更改任何设置或选项。

相关文章：