divタグの垂直スクロールバーを、ページがリフレッシュするときにasp.netタイマーコントロールを使用して設定する方法

Question

divタグを使用してそのアプリケーションでasp.netを使用してチャットアプリケーションを開発しています。divタグにasp .net Literalメッセージボックスと1つのタイマーコントロール、今、私の問題は、ページがリフレッシュされるかボタン（いつでも）をクリックするときですdivスクロールバーは常に一番上ですが、私はそれを底にとどめて、コードを調整する方法は？

<div id="divMessages" style="background-color: White; border-color:Black;border-width:1px;border-style:solid;height:300px;width:592px;overflow-y:scroll; font-size: 11px; padding: 4px 4px 4px 4px;" onresize="SetScrollPosition()"> 
    <asp:Literal Id="litMessages" runat="server" /> 
</div> 
<asp:TextBox Id="txtMessage" onkeyup="ReplaceChars()" onfocus="SetToEnd(this)" runat="server" MaxLength="100" Width="500px" ClientIDMode="Static" /> 
<asp:Button Id="btnSend" runat="server" Text="Send" OnClientClick="SetScrollPosition()" OnClick="BtnSend_Click" ClientIDMode="Static"/> 

とJavaScript関数は

function SetScrollPosition() 
{ 
    var div = document.getElementById('divMessages');    
    div.scrollIntoView(false); 
    //(or) 
    div.scrollTop = 10000; 
    //(both are checking) 
} 

である私にその

についての示唆を与えてください、私は、それが出て更新パネルで作業しているが、私はまた、更新パネルとタイマーコントロールを持っているthis exampleをチェックします私はそれらのコントロールを使用して、下部にdivスクロールバーを維持する必要があります私に何か提案を与える................

Answer 1

チェックこのコードSee this Example

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true" 
      ScriptMode="Release" /> 
     <script type="text/javascript"> 
      var xPos, yPos; 
      var prm = Sys.WebForms.PageRequestManager.getInstance(); 
      function BeginRequestHandler(sender, args) { 
       if ($get('<%=divMessages.ClientID%>') != null) { 
        xPos = $get('<%=divMessages.ClientID%>').scrollLeft; 
        yPos = $get('<%=divMessages.ClientID%>').scrollTop; 
       } 
      } 
      function EndRequestHandler(sender, args) { 
       if ($get('<%=divMessages.ClientID%>') != null) { 
        xPos = $get('<%=divMessages.ClientID%>').scrollLeft = xPos; 
        yPos = $get('<%=divMessages.ClientID%>').scrollTop = yPos; 
       } 
      } 
      prm.add_beginRequest(BeginRequestHandler); 
      prm.add_endRequest(EndRequestHandler); 
     </script> 

Answer 2

私は単純な解決策を持っているかもしれませんが、あなたが望むかどうかはわかりません。

伝統的には、このページにアクセスするときにURLのアンカーを設定し、ページを特別な場所にスクロールさせることができます。http://www.example.com/#message。

したがって、このアンカーを制御するためにjsを少し書くことができます。

<div id="divMessages" onresize="SetScrollPosition()"> 
    <asp:Literal Id="litMessages" runat="server" /> 
</div> 
<div id="msg-local" />//add new element is to auto scroll to here. 

function SetScrollPosition() 
{ 
    ...... 
    //set the url with anchor 
    window.location.hash = "go-msg-local"; 
    //set this value can disable browser auto scroll 
} 

//その後、ページロードイベント

function page_load { 
    if (window.location.hash) { 
     window.location.hash = "msg-local"; 
    } 
}