hCaptcha滚动到调用的顶部
hCaptcha滚动到调用的顶部
提问于 2022-06-30 02:30:19
我以不可见的模式向我的网站添加了hCaptcha，当按下表单上的submit按钮时，我会调用这个问题
await captcha.execute({ async: true }).catch(() => { // ... }
submitForm();但是，由于某些原因，这会导致页面滚动到顶部，然后向我展示hCaptcha挑战。
我怎样才能防止滚动发生呢？
回答 2
Stack Overflow用户
发布于 2022-08-04 10:46:40
Stack Overflow用户
发布于 2022-08-16 07:11:32
这似乎是火狐的一个问题。这种解决办法可以无形中地解决它。
确保您没有启用平滑滚动行为。
html {
/* Make sure this line is disabled! */
/* scroll-behavior: smooth; */
}创建一个变量，该变量稍后将用于存储当前的Y滚动位置，它可能也是一个class属性。
let currentScroll = 0;在hCaptcha初始化时，将其指向一个回调，该回调将在挑战出现时触发。
function onCaptchaOpen() {
if (('netscape' in window) && / rv:/.test(navigator.userAgent)) {
window.scrollTo({ top: currentScroll });
}
}
let widgetId = window.hcaptcha.render('contact-captcha', {
sitekey: '10000000-ffff-ffff-ffff-000000000001',
size: 'invisible',
'open-callback': onCaptchaOpen,
});然后找到submit按钮，并在触发captcha挑战之前存储当前滚动位置。
function validate(event) {
event.preventDefault();
currentScroll = (window.pageYOffset || document.scrollTop) - (document.clientTop || 0);
window.hcaptcha
.execute(widgetId, { async: true })
.then(({ response }) => console.log(response));
}
const submitButton = $('#submit-button').get(0);
submitButton.onclick = validate;页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/72809723
复制相关文章
相似问题
腾讯云开发者
