如何在视图

时间:2016-04-14 19:24:22

标签: jquery asp.net

我在aspx页面中有一个列表框。当页面加载时,我在隐藏字段上设置locationID并设置它在列表框中被选中。由于列表框中有许多项目。当页面没有回发时,我想在视图上显示所选项目。但是scrollintoview仅适用于元素。我在网上找到了一些例子,但它显示在顶部。我的代码不起作用。有人会告诉我如何在视图上显示所选项目。提前谢谢。

有我的jquery代码:

<script type="text/javascript">  

        $(document).ready(scrollLocation);

        function scrollLocation() {
          var offset = 0;
            var selectedIndex = $("#listLocation")[0].selectedIndex;
            alert(selectedIndex);
            $("#listLocation option").each(function (i, e) {
                if (i == selectedIndex) return false;
                offset += $(e).height();
            });
            $("#listLocation").scrollTop(offset);

        }  
</script>  

1 个答案:

答案 0 :(得分:0)

而不是使用offset()height的{​​{1}}加起来直到选定的option,然后scrollTop()。这是小提琴:https://jsfiddle.net/h226p90k/

<强> HTML

<select id="s1" size="5">
    <option value='1'>1<option>
    <option value='2'>2<option>
    <option value='3'>3<option>
    <option value='4'>4<option>
    <option value='5'>5<option>
    <option value='6'>6<option>
    <option value='7'>7<option>
    <option value='8'>8<option>
    <option value='9' selected='selected'>9<option>
    <option value='10'>10<option>  
    <option value='11'>11<option> 
    <option value='12'>12<option> 
    <option value='13'>13<option> 
    <option value='14'>14<option> 
    <option value='15'>15<option> 
</select>

<强> JS

$(function(){
    var offset = 0;  

    // Find the selected index
    var selectedIndex = $("#s1")[0].selectedIndex;
    $("#s1 option").each(function(i,e){             
        // if this is the selected one, stop
        if(i==selectedIndex) return false;
        // otherwise add up
        offset += $(e).height();    
    });    

    $("#s1").scrollTop(offset);
});