Question

我正在将jquery-steps与manu必填字段一起使用。我担心的是，每当条件失败时，页面就会滚动到顶部。

“条款和条件”页面上的内容特别冗长，这很烦人，如果用户未选中“我同意”复选框，则必须跳到底部重试。

这是我的简单代码：

var form = $("#myform");
form.validate({
   errorPlacement: function errorPlacement(error, element) {
      if (element.attr("name") == "type") {
         error.appendTo($('#errorbox'));
      }
      else {
         element.before(error);
      }
   },
   rules: {
      cgu: {
         required: true
      }
   },
   messages: {
      cgu: {
         required: 'Vous devez accepter les C.G.U pour poursuivre'
      }
   },
   focusInvalid: true,
   onfocusout: function (element) {
      $(element).valid();
   },
});

即使使用“ focusInvalid：true”，页面仍会滚动到顶部。

Answer 1

解决此变通办法：

focusInvalid: false,
    invalidHandler: function(form, validator) {
       if (!validator.numberOfInvalids())
          return;
       $('html, body').animate({
          scrollTop: $(validator.errorList[0].element).offset().top
       }, 2000);
    },

验证条件不满足时避免滚动顶部

1 个答案: