先来分析一下Jquery与UpdatePanel的运行机制:
1.Jquery分析:Jquery可以通过简单的代码对HTML元素添加各种属性和事件句柄,Jquery有一个重要的事件标记:“ready”,一般对Html元素的效果和事件句柄都通过这个ready事件来添加。就是页面上的元素的Jquery效果是在页面加载的时候绑定到元素上的。
2.UpdatePanel分析:UpdatePanel在应用中主要用于局部刷新,为避免整个页面的PostBack,其核心在于MicrosoftAjaxWebForm.js文件,他的局部刷新的过程就是将页面提交到服务器,执行完Server端的代码后一步将在UpdatePanel内的HTML进行重新呈现。
分析结果:UpdatePanel在刷新之后,其中的内容会重新生成一次,所以其中的元素上绑定的事件等效果就会消失。所以再次点击就没有效果了。所以需要重新绑定一下。
绑定方法如下:
function load() {
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
}
function EndRequestHandler() {
//这里写你需要重新绑定的jquery代码
}
然后在body添加属性:οnlοad=" load()"
完毕。