javascript - 页面向下滚动一半时 scrollTop 不工作

Question

我正在为 Iphone 开发应用程序，但遇到了问题。当侧面板打开时，我使用 scrollTop() 导航到页面顶部。如果页面向下滚动到可以看到侧面板的程度，它不会滚动到顶部，但是当我看不到面板时，它会滚动到顶部。
这是我的 HTML:

<div data-role="page" id="home" align="center">
    <div data-role="panel" id="popupPanel" data-position="left" ontouchmove="event.preventDefault()" data-display="reveal">
        <h3 id="userName2" class="blockText2"></h3>
        <ul data-role="listview" data-theme="b" style="margin-top:10px;">
            <a data-icon="false" data-role="button" data-shadow="false" data-corners="false" data-theme="b" id="seeYourProfile" href="#yourProfile" data-transition="slide" class="contentLink">Profile</a>
            <a data-icon='false' data-role="button" data-transition="slide" data-shadow="false" data-corners="false" data-theme="b" href="#about" class="contentLink">About</a>
            <a data-icon='false' data-role="button" data-transition="slide" data-shadow="false" data-corners="false" data-theme="b" href="#contacts" class="contentLink">My Contacts</a>
            <a data-icon='false' data-role="button" data-transition="slide" data-shadow="false" data-corners="false" data-theme="b" href="#teams" class="contentLink">My Teams</a>
            <a data-icon='false' data-role="button" data-transition="slide" data-shadow="false" data-corners="false" data-theme="b" onclick="sc.signOut();return false;" class="contentLink">Logout</a>
        </ul>
    </div>
    <div data-role="header" id="header" data-position="fixed" data-tap-toggle="false" style="z-index:99999;">
        <a href="#home" data-theme="none" data-role="none" id="btPopUpPanel" style="float:left;color:lightgrey;text-decoration:none;" data-direction="reverse" data-transition="slide"><i class="icon-reorder icon-2x"></i></a>
        <h1>News feed</h1>
        <a data-role="none" data-theme="none" id="btRefreshAllActivities" style="float:left;color:lightgrey;text-decoration:none;" data-transition="slide"><i class="icon-refresh icon-2x"></i></a>
    </div>

    <div data-role="content">
        <h3 id="noActivities">No activities found.</h3>
        <ul data-role="listview" data-theme="a" id="listActivities"></ul>
        <div id="submitBtn" style="margin-top:20px;">
            <button type="submit" data-shadow="false" data-corners="false" data-role="button" data-theme="b" id="btMoreActivity">More Activity</button>
        </div>
    </div>

这是我的 JS:

$('#btPopUpPanel').on('vclick', function() {
    if ($.mobile.activePage.jqmData("panel") !== "open") {
        $("#popupPanel").panel("open");
        $("#popupPanel").scrollTop();
    } else {
        $("#popupPanel").panel("close");
    }
});

我也试过 $("#home").scrollTop(); 和 $("#popupPanel").scrollTo(0,0); 但它没有不工作。有人有什么建议吗？

Answer 1

我自己找到了答案，而不是使用 $("#popupPanel").scrollTop(); 我使用了 document.getElementById('popupPanel').scrollIntoView();