如何使jquery UI滑块在回发时保持滚动位置

时间:2012-01-19 14:44:37

标签: jquery user-interface scrollbar

所以我在我的页面上实现了一个Jquery UI滑块。滑块的值作为参数提供给sql数据源。单击按钮,参数将输入数据源,屏幕上的gridview将重新绑定。问题是我希望滚动条保持其位置,以便用户知道输入的值是他们当前正在查看的gridview的参数。

以下是滚动条的代码:

 <!--Slider bar for investment-->

 <div style="float:right;">
 <script type = "text/javascript">

     $(function () {
         $("#slider").slider({
             value: 100,
             min: 1,
             max: 200,
             step: 1,
             slide: function (event, ui) {                     
                 $("#hiddenInvestment").val(ui.value);
             }
         });
         $("#hiddenInvestment").val($("#slider").slider("value"));
     });        
    </script>

<div class="demo">
<p>
<asp:label runat="server" id="amountlabel" >Investment:    
</asp:label>    
<input name="hiddenInvestment" id="hiddenInvestment" />
<asp:Label runat="server" ID="percentlabel">%</asp:Label>
</p>
<div id="Div1"></div>
</div>
<div class="demo" style="width:100px;">
<div id="slider"></div>
</div>

我认为我需要更改的行是'value:100',但我不确定我需要将其更改为。有什么建议吗?

1 个答案:

答案 0 :(得分:2)

您可以在页面上显示隐藏字段。在submit form postback slider设置此隐藏字段slider之前hidden。在页面加载时,初始化$(function () { $("#slider").slider({ value: ($('#sliderVale').val() || 100), min: 1, max: 200, step: 1, slide: function (event, ui) { $("#hiddenInvestment").val(ui.value); } }); $("#hiddenInvestment").val($("#slider").slider("value")); }); $('form').submit(function(){ $('#sliderVale').val($("#slider").slider("value")); }); 时会从此{{1}}字段中读取初始值。试试这个

{{1}}