javascript - 页面滚动的原因是什么

Question

在移动设备上查看我们的任何产品页面时，如果您单击附加信息选项卡，页面会滚动到窗口底部。

我尝试在 Chrome 开发者工具中通过在单击事件和滚动事件上放置断点来调试此问题，但我不确定是否正确调试了此问题？浏览器在 jquery-1.7.2.min.js 上中断，特别是在此代码块的前几行。

if (!(a.nodeType === 3 || a.nodeType === 8 || !c || !d || !(h = f._data(a)))) {
    d.handler && (p = d, d = p.handler, g = p.selector), d.guid || (d.guid = f.guid++), j = h.events, j || (h.events = j = {}), i = h.handle, i || (h.handle = i = function(a) {
        return typeof f != "undefined" && (!a || f.event.triggered !== a.type) ? f.event.dispatch.apply(i.elem, arguments) : b
    }, i.elem = a), c = f.trim(I(c)).split(" ");
    for (k = 0; k < c.length; k++) {
        l = A.exec(c[k]) || [], m = l[1], n = (l[2] || "").split(".").sort(), s = f.event.special[m] || {}, m = (g ? s.delegateType : s.bindType) || m, s = f.event.special[m] || {}, o = f.extend({
            type: m,
            origType: l[1],
            data: e,
            handler: d,
            guid: d.guid,
            selector: g,
            quick: g && G(g),
            namespace: n.join(".")
        }, p), r = j[m];
        if (!r) {
            r = j[m] = [], r.delegateCount = 0;
            if (!s.setup || s.setup.call(a, e, n, i) === !1) a.addEventListener ? a.addEventListener(m, i, !1) : a.attachEvent && a.attachEvent("on" + m, i)
        }
        s.add && (s.add.call(a, o), o.handler.guid || (o.handler.guid = d.guid)), g ? r.splice(r.delegateCount++, 0, o) : r.push(o), f.event.global[m] = !0
    }
    a = null
}

知道什么可能导致页面以这种方式滚动以及如何修复它吗？

Answer 1

问题在于，当您点击附加信息时，产品描述会折叠，导致页面中的元素向上移动，给人一种页面向下滚动的印象。

一种解决方案是获取像 $("#acctab-description") 这样的元素的偏移量，设置为像这样的某个变量，var offset = $("#acctab-description").offset().top ，然后使用 window.scrollTo(0, offset) 滚动到该高度，并将所有这些绑定(bind)到附加信息选项卡上的单击事件。

这可能需要一些按摩才能完全按照您喜欢的方式工作，并且肯定还有其他方法可以完成相同的事情，但是，问题不在于当您单击“其他”时页面滚动到底部info，页面元素向上移动，以响应产品信息 div 设置为 display:none 时丢失的高度