在第一次页面加载时，元素a的x效果正常，点击b之后，页面局部刷新，此时，回到a，元素a失去x效果.
开始以为是前端我这到程序员那里出现问题，但仔细检查之后发现没有，后来了解了下页面应用了asp.net ajax局部刷新，这就明朗了，估计是和jquery冲突了。
问题重现： 1.asp.net ajax在页面中添加scriptmanager和updatepanel
2.在updatepanel中添加元素a
3.用jquery对元素a添加x效果
4.在updatepanel中加一个button b用作postback
这样问题就出现了。
分析1： updatepanel在应用中主要用于局部刷新，避免整个页面的postback。updatepanel实现局部刷新的核心在于microsoftajaxwebform.js文件，它的局部刷新过程就是将页面提交到服务端（包含viewstate），执行服务端代码后异步将在updatepanel内的html进行重新呈现。在此过程中，页面的其它部分并没有状态更改。
分析2： jquery可以通过简单的代码对html元素添加各种属性和事件句柄，我们可以在这里看到官方的文档： tutorials:how jquery works
在这里，我们可以得知，jquery有个重要的事件标记“ready”，一般对html元素的效果和事件句柄都通过这个ready事件来添加，如下： $(document).ready(function () { $(“p”).text(“the dom is now loaded and can be manipulated.”); });
官方对此的说明是：ready事件会在dom完全加载后运行一次，ok，至此，问题的原因差不多明白了：
原因: 因为在updatepanel局部刷新之后，其中的元素a被重写，而此时整个dom树并没有重新加载，所以jquery的ready事件并没有触发，所以元素a就失去了原有的特效。
解决方案： 我们可以将ready事件中执行的代码提取出来，然后通过捕获scriptmanager的endrequest事件，在每次updatepanel局部刷新之后执行一次jquery初始化代码，如下所示： <script type=”text/javascript” > function slide(){ //here is code } function load() { sys.webforms.pagerequestmanager.getinstance().add_endrequest(endrequesthandler); } function endrequesthandler() { slide(); } </script >
最后就是需要 添加 <body onload="load()" >
如对本文有疑问， 点击进行留言回复！！
selenium + ajax抓取英雄联盟全部英雄的详细信息及多线程保存全部皮肤图片到本地
我要评论
网友评论