jQuery 验证插件无法滚动到 iOS 8 Safari 中出现验证错误的字段

Question

我正在使用 jQuery Validate plugin 用于验证表单输入(用户信息、地址、信用卡详细信息等)

该表格位于网站的移动版本上。

当您填写表单并向下滚动到页面底部的“购买”按钮时，如果您有无效字段(例如您忘记输入任何内容)，则单击“购买”按钮将聚焦无效字段输入并向上滚动到该输入。这一切都是由 jQuery 验证插件完成的。

这适用于我测试过的大多数移动浏览器(Android/Chrome、Windows Phone、移动 Safari iOS 7 及更低版本)。但是，iOS8+ 上的任何移动 Safari 浏览器都不会滚动。输入已获得焦点并且屏幕键盘会弹出，但是不会滚动到输入。

我调查了其他几个讨论类似但略有不同问题的线程，但找不到问题的解决方案!

对此的任何帮助都将受到极大的欢迎!

Answer 1

Title: jQuery Validate plugin unable to scroll to field with validation error in iOS 8 Safari

实际上，这不是任何浏览器的该插件的功能。

The jQuery Validate plugin's source code验证它只会将“焦点”带到无效字段，并且与滚动页面完全无关。如果您的移动浏览器正在滚动，则滚动到焦点元素只是浏览器的一项功能。

您必须编写自己的自定义 invalidHandler function找到第一个带有 error 类的元素并滚动到它。

Callback for custom code when an invalid form is submitted.

invalidHandler: function(event, validator) {
    // your code for finding invalid element and scrolling
}