当加载 sherpa 等第三方嵌入式元素时，页面会自动滚动至该元素位置，尤其在 chrome/edge 中明显，而 firefox 无此行为；根本原因在于 sdk 内部大量调用 `focus()` 或 `scrollintoview()`，且 `document.ready` 触发过早，无法覆盖其默认行为。
该问题并非由您的代码逻辑（如 $(document).ready() 中的 scrollTop）失效导致，而是 Sherpa SDK 在挂载（mount）过程中主动执行了聚焦或滚动操作——且这些操作发生在 DOM 就绪之后、您自定义滚动逻辑执行之前，甚至可能在 mount() 调用内部异步触发，因此 jQuery 的滚动重置完全无效。
官方 SDK 未提供 onMountComplete 或 onRendered 类型的回调钩子，也未暴露禁用自动滚动的配置项。直接通过 preventDefault()、stopPropagation() 或 CSS scroll-behavior: auto 均无法拦截 SDK 内部原生滚动调用。
✅ 推荐解决方案：使用沙箱化 iframe 隔离第三方组件
将 Sherpa 元素封装进受控的
<!-- 替换原 div#sherpa-trip-element --> <iframe id="sherpa-iframe" src="sherpa-widget.html" width="100%" height="600" frameborder="0" sandbox="allow-scripts allow-same-origin" ></iframe>
并在 sherpa-widget.html 中独立加载 SDK 和初始化逻辑：
<!-- sherpa-widget.html -->
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"></head>
<body style="margin:0; overflow:hidden;">
<div id="sherpa-trip-element" style="width:100%; height:100%;"></div>
<script src="https://sdk-sandbox.joinsherpa.io/widget.js?appId=sxM5NjIzNz"></script>
<script>
// 确保在 iframe 内部上下文中执行
window.addEventListener('load', () => {
const elementConfig = {
language: 'en-US',
trip: { originAirport: "RIX", destinationAirport: "TLL" },
placement: '',
features: { showFilters: true, showMapLegend: true }
};
if (window.$sherpa?.V2) {
$sherpa.V2.createElement('map', elementConfig).mount('#sherpa-trip-element');
}
});
</script>
</body>
</html>⚠️ 注意事项
- sandbox 属性必须包含 allow-scripts（运行 JS）和 allow-same-origin（确保 SDK 跨域请求正常），但避免添加 allow-top-navigation 等高风险权限；
- 若需父子通信（如传递航班参数），可通过 postMessage 安全实现，避免直接 DOM 访问；
- iframe 高度建议设为固定值或通过 ResizeObserver 动态同步（需双方配合），避免内容截断；
- 此方案同时提升安全性与稳定性——第三方脚本崩溃或重排版不会影响主站布局与滚动锚点。
综上，面对缺乏 API 控制权的第三方嵌入组件，iframe 不是“权宜之计”，而是符合 Web 标准的最佳实践：它以天然的浏览上下文隔离，从根本上解耦滚动副作用，兼顾兼容性、可维护性与用户体验一致性。
