Question

我有以下设置：

UpdatePanel - ＆gt;多视图 - ＆gt; 3次观看

当我点击其中一个视图中的按钮时，它应该转到下一个视图，慢慢地滚动到顶部。

目前我一直在尝试以下方法，其中没有一种方法（甚至不是快速滚动 - 它只是仍然嘲笑我;-)）：

protected void PartOneContinue_Click(object sender, EventArgs e)
{
    CheckoutFlow.SetActiveView(PaymentMethodView);
    ScriptManager.RegisterStartupScript(this, this.GetType(), "myscript", "<script>scrollTo(0,0);</script>", true);
}

以下内容：

ScriptManager.RegisterStartupScript(this, this.GetType(), "myscript", "<script>$(window).scrollTop(100);</script>", true);

以下ScrollToTop是一个带有上述两个不同脚本的函数：

ClientScriptManager cs = Page.ClientScript;       
cs.RegisterStartupScript(this.GetType(), "ScrollToTop", "ScrollToTop()");

任何想法都将受到高度赞赏。

Answer 1

尝试此方法

    private void SubirTelaTopo()
    {
        StringBuilder csText = new StringBuilder();
        csText.Append("$('body,html').animate({ scrollTop: 0 }, 500);");
        ScriptManager.RegisterStartupScript(this.Page, this.Page.GetType(), Guid.NewGuid().ToString(), csText.ToString(), true);
    }

Answer 2

你检查过你的doctype吗？同时将html和body的（css）高度设置为100％可能有所帮助。

Answer 3

在致电ScriptManager.RegisterStartupScript时，您传入的脚本包括<script>标记，并且还会传递true addScriptTags参数。我的猜测是在页面中呈现的脚本块如下所示：

<script type="text/javascript">
<script>scrollTo(0,0);</script>
</script>

我可以想象，由于嵌套脚本标记，这在大多数浏览器中都不起作用。尝试从您的JavaScript代码段中删除代码或将false传递给addScriptTags

// Option 1
ScriptManager.RegisterStartupScript(this, this.GetType(), 
  "myscript", "scrollTo(0,0);", true);

// Option 2
ScriptManager.RegisterStartupScript(this, this.GetType(), 
  "myscript", "<script>scrollTo(0,0);</script>", false);

如果这不能解决您的问题，那么您可以考虑使用PageRequestManager.pageLoaded事件纯粹使用客户端脚本解决此问题：

页面上的所有内容都会引发pageLoaded事件刷新，是否由于同步而刷新（整页）回发或异步回发。你可以用它事件为更新的内容提供自定义过渡效果。

单击按钮时，Updatepanel并滚动到顶部

3 个答案: