用定時器滾動備份

我創建了一個聊天應用程序。當我添加一些東西到文本框並點擊輸入文本添加到數據綁定和滾動條上升。我用一個JavaScript向下滾動，點擊工作正常，但由於計時器的原因，滾動條回到頂部，很快它就被拖拽了。我的代碼如下用定時器滾動備份

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
<style type="text/css"> 
#kdiv1 
{ 
    position:relative; 
    left:300px; 
    top:20px; 
    height:400px; 
    width:400px; 
    overflow:auto; 
} 
#kdiv2 
{ 
    position:relative; 
    top:100px; 
    left:300px; 
} 
</style> 
    <script type="text/javascript"> 
    function scrooldown(div) { 
     var scrollDiv = document.getElementById(div); 
     scrollDiv.scrollTop = scrollDiv.scrollHeight; 
     scrollDiv = null; 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server" defaultfocus="text"> 
    <div> 
     <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true"> 

     </asp:ScriptManager> 
     <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true" RenderMode="Block"> 
     <Triggers> 
     <asp:AsyncPostBackTrigger ControlID="button1" EventName="Click" /> 
     </Triggers> 
     <ContentTemplate> 
     <div id="kdiv1"> 
      <asp:Repeater ID="Repeater1" runat="server"> 
      <ItemTemplate> 
      <span> 
      <%# DataBinder.Eval(Container.DataItem, "Message") %> <br /> 
      </span> 
      </ItemTemplate> 
      </asp:Repeater> 
     </div> 
      <div id="kdiv2"> 
      <asp:TextBox ID="text" runat="server"/> 
      <asp:Button ID="button1" runat="server" onclick="button1_Click" OnClientClick="scrooldown('kdiv1')" /> 
      </div> 
     </ContentTemplate> 
     </asp:UpdatePanel> 
     </div> 
    </form> 
</body> 
</html>

C＃代碼

protected void button1_Click(object sender, EventArgs e) 
    { 
     string MyConString = "DRIVER={MySQL ODBC 3.51 Driver};" + "SERVER=localhost;" + "DATABASE=chatserver;" + "UID=root;" + "PASSWORD=********;" + "OPTION=3"; 
     OdbcConnection MyConnection = new OdbcConnection(MyConString); 
     try 
     { 
      OdbcCommand cmd = new OdbcCommand("INSERT INTO shoutbox(name, message)VALUES(?, ?)", MyConnection); 
      cmd.Parameters.Add("@email", OdbcType.VarChar, 255).Value = "something"; 
      cmd.Parameters.Add("@email", OdbcType.Text).Value = text.Text; 
      MyConnection.Open(); 
      cmd.ExecuteNonQuery(); 
      MyConnection.Close(); 
     } 
     catch 
     { 
     } 
     try 
     { 
      MyConnection.Open(); 
      OdbcCommand cmd = new OdbcCommand("Select message from shoutbox", MyConnection); 
      OdbcDataReader dr = cmd.ExecuteReader(); 
      ArrayList values = new ArrayList(); 
      while (dr.Read()) 
      { 
       string ep = dr[0].ToString(); 
       values.Add(new PositionData(ep)); 
      } 
      Repeater1.DataSource = values; 
      Repeater1.DataBind(); 
      text.Text = ""; 
      UpdatePanel1.Update(); 
     } 
     catch 
     { 

     } 
    } 
}

來源

2011-09-16 Mal

有人用C＃重新編譯 - 我沒有privs，謝謝。 – jimbojw

@jimbojw - 我不認爲C＃在我的問題中有作用。我的錯誤是客戶端錯誤的清楚理解我添加了我的C＃代碼，但事實上，這不會解決我的錯誤。 – Mal

這很可能是一個客戶端問題，但我認爲通過使用所有適當的標籤標記標籤，您可以找到更好的答案。只要你開始談論「數據綁定」，我的眼睛就會眩目，因爲我不知道它會發生什麼。 :) – jimbojw

你會得到一個更好的結果，如果你移動DIV kdiv1的UpdatePanel周圍，而不是內部：

<div id="kdiv1"> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true" RenderMode="Block"> 
     ... 
    </asp:UpdatePanel> 
</div>

與當前的問題情況是div kdiv1本身將在每次部分回發後被替換，並且其所有狀態（如滾動位置）都將丟失。

但是，即使在此更改之後，您仍然有問題，即在部分回發後添加的行不在可見區域內，因爲這些新行將在最後一次調用後添加scrolldown('kdiv1')。

要解決這個問題，您可以註冊一個函數，每次發生部分回發時都會調用該函數。您可以通過添加下面的JavaScript頁面的標題做到這一點：

<script language="javascript"> 
    window.onload = function() 
    { 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(function(sender, args) { 
      scrolldown('kdiv1'); 
     }); 
    }; 
</script>

注：在我的例子，我寫了「下滾」而不是「scrooldown」，因爲我認爲這是一個錯字。

來源

2011-09-16 21:59:03

真棒..！我應該在哪裏添加代碼'window.onload'？ – Mal

@Kars - 我更新了我的回覆，以更具體地討論'window.onload'代碼。 –

用定時器滾動備份

回答

相關問題