闲云博客

关注互联网科技,记录编程点滴

2017/09/15
by Jian Yun
0 comments

利用history.pushState方法禁用浏览器的后退按钮

上一篇文章中介绍了HTML5新增的管理history的两个API。这里介绍利用其中的API来达到禁用浏览器后退按钮的功能。

if (window.history && window.history.pushState) {
    history.pushState("forward", null, location.href);
    $(window).on("popstate", function() {
         history.pushState("forward", null, location.href);
     });
}

 

2017/09/15
by Jian Yun
1 Comment

利用html5的history.replaceState修改当前页面的URL

我们知道浏览器有一个history对象,用来保存浏览历史,用户可以通过点击浏览器的后退或前进按钮在历史记录中切换。之前对history的操作的API主要是前进、后退、跳转等,而在HTML5中提供了2个新方法来加强对history的管理。

history.pushState(state, title, url);
history.replaceState(state, title, url);

两个方法的参数是一样的。说明如下:

  • state:一个与指定历史记录相关联的状态对象,当popstate事件触发时,会把该对象传入回调函数。如果不需要用到,可以传null。
  • title:页面的标题。但当前大多数浏览器都不支持或忽略这个值。可以传null。
  • url:添加或修改的history的网址。为了安全性,必须保持与当前URL同一个域。

顾名思义,两个方法的区别只是pushState添加一个最新的历史记录,而replaceState则是把当前的页面的历史记录替换掉。他们最大的特点是添加或替换历史记录后,浏览器地址栏会变成你传的地址,而页面并不会重新载入或跳转。

例如,假设当前的页面地址是example.com/1.html,且history中此时只有一条当前页面的记录。

当你执行 history.pushState(null, null, “2.html”)后,浏览器的地址栏会显示example.com/2.html,但并不会跳转到2.html,甚至并不会去检查2.html存不存在,只是加入一个最新的历史记录项。此时history中会有两个记录。假如你此时点击页面上的link跳转到另外一个页面后,点击浏览器的后退按钮,则url会变成example.com/2.html,如果此前的1.html的页面浏览器有缓存的话会显示1.html的内容,否则会发起请求example.com/2.html。如果再次点后退,url会变成example.com/1.html。

而如果执行 history.replaceState(null, null, “2.html”)的话,浏览器的地址栏也会显示example.com/2.html,区别是history中只有当前2.html的记录,而1.html的记录已被替换掉。

利用这些特性,可以用来修改当前页面的URL来达成某些目的,比如可以用来记住搜索条件。

如果页面是数据展示的页面,页面上有一些搜索或过滤的条件,当用户点击这些条件时,页面通过AJAX把结果呈现到页面上,当点击某个结果页面跳转到下一个页面后,用户点击浏览器的后退按钮回到前一个页面后,即使页面有缓存,AJAX获取的结果也不会保留在页面上。如果后退后,需要记住此前的搜索条件和结果,可以在用户点击搜索条件时,把搜索条件利用history.replaceState添加到页面的query string中。

if (history.replaceState) {
    history.replaceState(condition, null, "?" + $.param(condition, true));
}

页面可以设置成no-cache,当用户后退时,浏览器会重新请求带搜索条件的URL,后台根据搜索条件,把对应的结果页面呈现出来,从而达到记住搜索条件和结果的目的。

2016/06/01
by Jian Yun
0 comments

.NET Framework 4.5 GridViewCommandEventArgs新增Handled属性

最近有个老项目从framework 2.0升级到了4.5,测试过程中发现有个GridView的功能异常。这个GridView只绑定数据,并没有EditTemplate去做编辑的功能。但是在点击某个数据行的command之后,Gridview的绑定列会变成带textbox的编辑模式。最后发现原因是CommandName用了”Edit”,而这个正好是GridView自带的编辑功能的CommandName, 所以跑完自己RowCommand里的逻辑后,又跑了GridView中自带的HandleEdit方法,从而导致不必要的异常功能。

解决方法在.NET Framework4.5之前,我们一般会避免使用与系统使用的CommandName一致的字符串,比如可以改为“_Edit”。
现在4.5之后,RowCommand事件的GridViewCommandEventArgs参数新增了Handled属性,我们处理完自己的逻辑之后,可以把这个属性设为true,这样GridView的HandleEvent直接就返回结果结束了,而不会跑下面的代码逻辑了。

2016/04/08
by Jian Yun
0 comments

ASP.NET系统:访问某个页面碰到编译错误CS0120

同样的代码,某个同事build后再自己机器上跑某个页面碰到编译错误,而在我的机器上没有碰到问题。

具体错误如下示例:

Compiler Error Message: CS0120: An object reference is required for the non-static field, method, or property '<ProjectName>.<PageName>.System'

Source Error:


Line 195:        
Line 196:        private static System.Reflection.MethodInfo @__PageInspector_LoadHelper(string helperName) {
Line 197:            System.Type helperClass = System.Type.GetType("Microsoft.VisualStudio.Web.PageInspector.Runtime.WebForms.TraceHelpers, Microsoft" +
Line 198:                    ".VisualStudio.Web.PageInspector.Tracing, Version=xx.xx.xx.xx, Culture=neutral, Publi" +
Line 199:                    "cKeyToken=b03f5f7f11d50a3a", false, false);

 

注意到提示错误的object的xx.xx.xx.System,排查后发现该页面有个控件的ID是”System”,我们猜测是这一特殊的控件ID命名导致的编译错误。可能是编译器误以为”System“是Framework里的”System“命名空间。