JQUERY实现滚动条在输入的值的位置

页面已展现一排数据，比如10020,10021,10022,10023等等。然后有一个输入框，我要实现输入框中输入一个值比如是10028，那么滚动条就会移动到10028的位置。这个要如何实现，百度了很对都感觉不对劲。求教大神，拜托详细点谢谢。

一排数据时几个意思？横排还是竖排？竖排用这个


<style>div{line-height:30px}</style>
<input type="text" onpropertychange="setScrollTop(this)" oninput="setScrollTop(this)" style="position:fixed;right:0;top:0;background:yellow;color:#f00" />
<script>
    for(var i=10020,j=i+100;i<j;i++)document.write('<div>'+i+'</div>')
</script>
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.7.1/jquery.min.js"></script>
<script>
    function setScrollTop(el) {
        if (el.value == '') return;
        var div = $('div').filter(function () { return this.innerHTML == el.value });
        if (div.length) document.body.scrollTop = document.documentElement.scrollTop = div.offset().top;
    }
</script>

<!DOCTYPE html>

Document
 .redMark{ color: red; font-weight: bold; } .blueMark{ color: blue; font-weight: bold; } 

 function scrollToError() { var body = $('html,body'); var scroll_1 = $('.try').first(); var scroll_2 = $('#test'); if(scrollTo.length) { body.animate({scrollTop:scroll_1.offset().top - 100 }, 2000); body.animate({scrollTop:scroll_2.offset().top - 100 }, 2000); } }

Hello World!

http://www.cnblogs.com/makesense/p/5633895.html

页面高度足够的情况下

 css样式
 .scroll-layer{
    width: 100%;
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
}
.scroll-layer p{
    height: 4rem;
    line-height: 2rem;
    font-size: 1.3rem;
    padding-left: 10px;
}
.scroll-layer input{
    height: 3rem;
    line-height: 3rem;
    border: 1px solid #eee;
    width: 100%;
    outline: none;
    margin: 0;
    padding: 0 0 0 1rem;
}
.scroll-layer button{
    margin: 10px 10%;
    width: 80%;
    border: none;
    outline: none;
    background: lightblue;
    color: #fff;
    height: 3rem;
    line-height: 3rem;
    text-align: center;
    font-size: 1.2rem;
}

html代码

 <div class="scroll-layer">
                <p>能够输入的值：100,500,1000,1500,2000,2500,2652</p>
                <input type="text" placeholder="输入滑动位置"/>
                <button onclick="setScrollTop()">开始滑动</button>
    </div>

jquery代码

 $(function(){
                    console.log($('html,body').height());
                    var bodyHeight = $('html,body').height();
                    window.setScrollTop = function(){
                        var val = $('.scroll-layer').find('input').val();
                        bodyHeight >= val && $('html,body').animate({'scrollTop':val},1000);
                    }
})

点击开始滑动按钮，滑动到你input输入的位置，注意在p标签的提示最大值不能超过html高度。
最终效果：图片说明
由于图片，只能展示浮窗，点击开始，滚动条就会滑动到指定位置。