亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何以步驟形式進行驗證?

如何以步驟形式進行驗證?

慕的地8271018 2021-10-14 13:04:56
我有一個包含三個步驟的表格:選擇飲料,選擇吃和發送。我在驗證方面遇到了任何問題?,F在我的驗證僅適用于提交。但是我需要在每一步(在下一個按鈕上)進行驗證。怎么做?$.validity = {  defaults: {    errors: {      badInput: 'Bad input',      customError: 'Custom error',      patternMismatch: 'Pattern mismatch',      rangeOverflow: 'Range overflow',      rangeUnderflow: 'Range underflow',      stepMismatch: 'Step mismatch',      tooLong: 'Too long',      tooShort: 'Too short',      typeMismatch: 'Type mismatch',      valueMissing: 'Value missing'    },    unknownError: 'Unknown error',    output: function(input, message) {      console.log('validity.output', input, message);    },    getMessage: function(input) {      if (input.validity.valid)        return '';      for (var error in this.errors) {        if (input.validity[error])          return this.errors[error];      }      return this.unknownError;    }  }};$.fn.validity = function(options) {  options = $.extend({}, $.validity.defaults, options);  return this.each(function() {    var component = $(this);    var form = component.closest('form');    var elements = $(form.prop('elements'));    elements.on('input', function() {      options.output(this, options.getMessage(this));    });    form.on('submit', function(e) {      if (this.checkValidity())        return;      e.preventDefault();      e.stopPropagation();      elements.trigger('input');    });    form.attr('novalidate', true);  });}var mainForm = '.form';$(mainForm).validity({  output: function(input, message) {    var field = $(input).closest('.form__field');    field.toggleClass('m-error', !!message);    field.find('.form__error').text(message);  }});
查看完整描述

2 回答

?
開滿天機

TA貢獻1786條經驗 獲得超13個贊

您可以在 javascript 中逐個驗證字段:

用 :

onClick='validatefunction()'


查看完整回答
反對 回復 2021-10-14
?
至尊寶的傳說

TA貢獻1789條經驗 獲得超10個贊

  1. 為每個步驟的每個下一步按鈕指定一個不同的類名(“js-next1,js-next2)”。

  2. 現在將這些按鈕綁定到點擊事件(函數)以在點擊這些按鈕時驗證所需的字段。


查看完整回答
反對 回復 2021-10-14
  • 2 回答
  • 0 關注
  • 244 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號