javascript - 如何保持列表框中滚动条的滚动位置

Question

After Submitting the form the scroll goes up how will retain the position of the scroll ? this code does not work can anyone help thank you in advance or advice to do.

      <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>

<style>
        .container {
            border:2px solid #ccc;
            width:600px;
            height: 1000px;
            overflow-y: scroll;
        }
        </style>

<script>
var scrollPos=$("form").scrollTop();
onclick="javascript: submit()

</script>
<form method="post" name="form">

    <div id="Html2" style="position:absolute;left:0x;top:60px;width:250px;height:100px;z-index:12" class="container">
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>
        <input onclick="javascript: submit()" type="checkbox">Checkbox1
        <br>

    <script>    $("form").scrollTop(scrollPos);</script>

    </div>
</form>


</script>
</div>
</form>

Answer 1

这就是我在纯 Javascript 中的做法:

var elem = document.querySelector(".container");
elem.onscroll = function () {
    sessionStorage.setItem('scroll', elem.scrollTop);
};

if (sessionStorage.getItem('scroll') != null) {
    elem.scrollTop = parseInt(sessionStorage.getItem('scroll'));
}

Here is the JSFiddle demo