jQuery scrollTop 在 iOS 上的 iframe 内不起作用

Question

iOS 和 iframe.. 太痛苦了。 我有一个简单的 back to top 按钮，它应该为滚动设置动画（而不是仅仅跳到页面顶部）。

$(document).on('click touchstart', '.backtotop', function() {
    $('html, body').animate({ scrollTop: 0 }, 1500);
});

这适用于任何地方，iOS 上的 iframe 除外。我还没有完全理解 iOS 是如何处理 iframe 的。 jQuery 的 .scrollTop() 函数也不起作用（无论如何都不能动画）。

在 iOS 上的 iframe 中唯一有效的是：

parent.self.scrollTo(0, 0);

显然不是最佳解决方案，因为这不适用于桌面浏览器。 非常感谢任何有关如何在 iOS 上修复此问题或 iframe 的更深入知识。

Answer 1

似乎指定上下文可以解决问题：

$('body, html', parent.document).animate({ scrollTop: 0 },1500);

由于这仅适用于 iOS，我已包含来自 this thread 的 iOS 检测：

var iOS = ( navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false );

$(document).on('click touchstart', '.backtotop', function() {
    if (iOS) {
        $('html, body', parent.document).animate({ scrollTop: $("body").offset().top},1500,"easeOutQuart");
    } else {
        $('html, body').animate({ scrollTop: $("body").offset().top},1500,"easeOutQuart");
    }
});

显然只有 parent.document 可以作为上下文。 parent.window 或者只有document 没有效果。