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

提交页面定位问题一直骚扰我,比如我们在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
Version data is listed when the mouse hovers over a link, or the link has focus.
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;绑定;

(0)

相关推荐

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

    提交页面定位问题一直骚扰我,比如我们在DataGrid外面加了来使DataGrid在一定区域内呈现,这样如果把滚动条拉到底部的时候点击修改(或者修改后点击更新,取消)页面重新加载的时候都会把滚动条拉到页面最上面部分 ,特此我将下面知识共享一下: object.scrollIntoView( [bAlignToTop]) Parameters bAlignToTop Optional. Boolean that specifies one of the following values: true

  • JSP页面文件中base标记用法实例分析

    本文实例分析了JSP页面文件中base标记用法.分享给大家供大家参考,具体如下: 我们在用IDE工具生成JSP页面时通常都包含下面的两段代码, <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %

  • PHP防止刷新重复提交页面的示例代码

    PHP防止刷新重复提交页面的示例代码 作为phper,我们在开发和学习php过程中,难免要经常的接受处理表单数据,然而处理表单的时候总会有一个问题,困扰大家,刷新页面重复提交的问题.如何防止刷新页面重复提交呢? PHP防止刷新重复提交,通过不断刷新(Refresh or Reload)表单提交页面,可以重复提交表单内容,可以利用 PHP 的 Session 来避免这一点,Session 保存在服务器端,在 PHP 过程中改变 Session 变量的值后,即保存在服务器端,下次访问这个变量时,得到

  • JQuery.get提交页面不跳转的解决方法

    代码如下: 复制代码 代码如下: <%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"     CodeFile="Default.aspx.cs" Inherits="_Default" %> <asp:Content ID=&quo

  • 小程序开发踩坑:页面窗口定位(相对于浏览器定位)(推荐)

    开发中我们要做一些类似遮罩层或者页面header固定而页面内容滚动的效果时,往往会使用到:position: fiexd;属性,但是往往会出现绑定在定位元素上的事件无法触发,原因出现在哪里? 经过摸索,终于找到答案:元素定位之后, z-index的值默认还是0,又因为定位而导致元素脱离了原来的文档流(page页面层),所以,定位元素相对于用户来说,虽然看得见,但是就像已经"不存在"一样,所以必须设置值:z-index至少大于等于1,将定位元素暴露给用户,这样才能触发绑定在元素之上的事件

  • JS使用正则表达式提交页面验证的代码

    如何用正则表达式提交验证 首先,我们先用一首歌活跃一下气氛! 门前大桥下 游过一群鸭 快来快来数一数 二四六七八 嘎嘎嘎嘎 真呀真多呀- stop,我们来进入正题↓ 1:让你们看一下我么老师布置的作业 2:需要呈现的效果是:看图片 3:那么,下面需要的就是代码 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title><

  • vue项目,代码提交至码云,iconfont的用法说明

    一.前期准备 首先得有一个码云账号,账号名最好是英文,用于线上仓库 其次下载一个git到电脑,因为很多git命令,cmd命令行识别不了 最好再有一个Iconfont账号,很多前端用到的图标就不用再自己画了,直接添加到项目下载下来就可以用了 还需要用到的有node 二.建立项目 1.首先在码云上新建一个私有的项目(如果项目是共有的,那么所有人都能看见,一般设为私有,然后将项目组的人拉进来就可以了),使用READERME文件初始化这个项目,语言选择javascript,克隆到本地 其中需要完成线上仓

  • Appium自动化测试实现H5页面元素定位

    目录 简介 H5元素定位准备工作 Webview 调试模式是否开启检查 拿到H5页面地址和chrom版本信息 实战案例 简介   在现在的移动端App中,由于开发效率.需求频繁变更的需求情况下,经常有相关的运营需求,经常要进行更新,如果全部采用原生开发,需要的成本比较高,后来就出现了内嵌的H5页面.那么这些H5页面元素该如何进行定位操作呢?   针对这种H5场景直接使用前面所讲的方法来进行定位是不行,因为前面的都是基于Andriod原生控件进行元素定位,而Web网页是单独的B/S架构,两者的运行

  • selenium+python自动化测试之页面元素定位

    上一篇博客selenium+python自动化测试(二)–使用webdriver操作浏览器讲解了使用webdriver操作浏览器的各种方法,可以实现对浏览器进行操作了,接下来就是对浏览器页面中的元素进行操作,操作页面元素,首先要找到操作的元素,对元素进行定位 查看页面源码 要定位页面元素,需要找到页面的源码,IE浏览器中,打开页面后,在页面上点击鼠标右键,会有"查看源代码"的选项,点击后就会进入页面源码页面,在这里就可以找到页面的所有元素 使用Chrome浏览器打开页面后,在浏览器的地

  • asp.net 处理F5刷新页面重复提交页面的一个思路

    当提交完一个页面后,如果我们再次点击F5刷新该页面的话,会弹出一个提示,提示我们如果继续,则会重新发送提交我们刚才提交的内容,要是类似付款或一次性的操作,我们不应该这样操作,否则会造成重复提交的问题.解决这个问题,我们可以通过如下思路来处理: 1. 提交成功后,将一个成功状态存入session中,然后重新载入该页面. 2. 在page_load方法中,判定该session字段的状态值,如果为成功,则显示成功信息,否则显示错误提示,紧跟着通过Session.Remove()方法来清空该缓存即可.

随机推荐