提交页面的定位--scrollIntoView的用法

所属分类: 网络编程 / ASP.NET 阅读数: 275
收藏 0 赞 0 分享
提交页面定位问题一直骚扰我,比如我们在DataGrid外面加了来使DataGrid在一定区域内呈现,这样如果把滚动条拉到底部的时候点击修改(或者修改后点击更新,取消)页面重新加载的时候都会把滚动条拉到页面最上面部分 ,特此我将下面知识共享一下:
object.scrollIntoView( [bAlignToTop])

Parameters

bAlignToTop Optional. Boolean that specifies one of the following values:
true Default. Scrolls the object so that top of the object is visible at the top of the window.
false Scrolls the object so that the bottom of the object is visible at the bottom of the window.

Return Value

No return value.

Remarks

The scrollIntoView method is useful for immediately showing the user the result of some action without requiring the user to manually scroll through the document to find the result.

Depending on the size of the given object and the current window, this method might not be able to put the item at the very top or very bottom, but will position the object as close to the requested position as possible.

Example

This example uses the scrollIntoView method to underline the content of the document's fifth paragraph and scroll it into view at the top of the window.

HideExample

  var coll = document.all.tags("P");
if (coll.length >= 5)
{
coll(4).style.textDecoration = "underline";
coll(4).scrollIntoView(true);
}

Standards Information

There is no public standard that applies to this method.

Applies To

INPUT type=ra...
Platform Version
Win16: 4.0
Win32: 4.0
Windows CE: 4.0
Unix: 4.0
Mac: 4.0
A, ADDRESS, APPLET, AREA, B, BIG, BLOCKQUOTE, BR, BUTTON, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, COMMENT, controlRange, CUSTOM, DD, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FONT, FORM, hn, HR, I, IFRAME, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, KBD, LABEL, LEGEND, LI, LISTING, MAP, MARQUEE, MENU, NOBR, OBJECT, OL, P, PLAINTEXT, PRE, S, SAMP, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TextRange, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, WBR, XMP
Move the mouse pointer over an element in the Applies To list to display availability information for the listed platforms.

二、在.Net中的应用
1、定位指定控件
/// <summary>
  /// 定位txtCode控件
  /// </summary>
  private void Scroll()
  {
   string s="<script>function window.onload(){document.all('"+this.txtCode.ClientID+"').scrollIntoView();}</script>";
   Page.RegisterStartupScript("",s);
  }

2、定位指定DataGrid列
 
<div style="BORDER:0px;PADDING:0px;MARGIN:0px;OVERFLOW:scroll;WIDTH:600px;HEIGHT:200px" align="center">

现在给出一种简单的办法(其他的一些利用锚点等办法都比较复杂)
private void Scroll(int index)
        
{
            
string s="<script>function window.onload(){document.all('"+this.DataGrid1.ClientID+"').rows["+index+"].scrollIntoView();}</script>";
            Page.RegisterStartupScript(
"",s);
        }

写了一个方法,其中DataGrid1换成自己的DataGrid的ID,这个方法传递进去的参数就是行号,也就是e.Item.ItemIndex。
比如在编辑操作的时候会写this.DataGrid1.EditItemIndex=e.Item.ItemIndex;
在此语句的以前加入Scroll(e.Item.ItemIndex);就可以了
同样在更新操作的时候写为Scroll(e.Item.ItemIndex);this.DataGrid1.EditItemIndex=-1;绑定;
更多精彩内容其他人还在看

.NET Core源码解析配置文件及依赖注入

这篇文章我们设计了一些复杂的概念,因为要对ASP.NET Core的启动及运行原理、配置文件的加载过程进行分析,依赖注入,控制反转等概念的讲解等
收藏 0 赞 0 分享

.NET Corek中Git的常用命令及实战演练

这篇文章将通过故事的形式从Git的历史谈起,并讲述Git的强大之处。然后通过实战演练教你如何在Github以及码云上托管我们的代码并进行代码的版本控制
收藏 0 赞 0 分享

Asp.Net Core WebAPI使用Swagger时API隐藏和分组详解

这篇文章主要给大家介绍了关于Asp.Net Core WebAPI使用Swagger时API隐藏和分组的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用Asp.Net Core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

如何利用FluentMigrator实现数据库迁移

这篇文章主要给大家介绍了关于如何利用FluentMigrator实现数据库迁移的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

ASP.NET Core利用Jaeger实现分布式追踪详解

这篇文章主要给大家介绍了关于ASP.NET Core利用Jaeger实现分布式追踪的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用ASP.NET Core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

浅谈从ASP.NET Core2.2到3.0你可能会遇到这些问题

这篇文章主要介绍了ASP.NET Core2.2到3.0可能会遇到的问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

详解.net core webapi 前后端开发分离后的配置和部署

这篇文章主要介绍了.net core webapi 前后端开发分离后的配置和部署,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

详解ASP.Net Core 中如何借助CSRedis实现一个安全高效的分布式锁

这篇文章主要介绍了ASP.Net Core 中如何借助CSRedis实现一个安全高效的分布式锁,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
收藏 0 赞 0 分享

.net 4.5部署到docker容器的完整步骤

这篇文章主要给大家介绍了关于.net 4.5部署到docker容器的完整步骤,文中通过示例代码介绍的非常详细,对大家学习或者使用.net4.5具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享

.net core并发下线程安全问题详解

这篇文章主要给大家介绍了关于.net core并发下线程安全问题的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用.net core具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
收藏 0 赞 0 分享
查看更多