使用easyui 的好处除了界面还不错之外，也因为使用方便。 复制代码 代码如下: <div class="easyui-tabs" style="width: 300px"> <div title="搜索"> ...</div> <div title="选择">...</div> <div title="返回">...</div> </div> 只要给他定义个相应的class 就能实现各种效果。 但是，把它放在updatepanel里面，且不是首次就让他显示出来的话就出故障了。 复制代码 代码如下: <asp:MultiView ID="MultiView1" runat="server"> <asp:View ID="View1" runat="server"> <div class="easyui-tabs" style="width: 300px"> <div title="搜索"> ...</div> <div title="选择"> ...</div> <div title="返回"> ...</div> </div> </asp:View> <asp:View ID="View2" runat="server"> <div class="easyui-tabs" style="width: 300px"> <div title="搜索"> ...</div> <div title="选择"> ...</div> <div title="返回"> ...</div> </div> </asp:View> </asp:MultiView> 在multipleView里面定义两个一样的view，内容也一样。并把 MultiView1放到updatepanel里面。 然后设置他显示第一个view 复制代码 代码如下: MultiView1.ActiveViewIndex =0; 浏览一下。显示正常。但是当我们改变view的显示时，例如把上面的改成 MultiView1.ActiveViewIndex =1；那么第二个veiw的效果就全无了。 到jquery.easyui.min.js 里找原因。看到了这么一句 复制代码 代码如下: r=$(".easyui-tabs",_1ec); if(r.length){ r.tabs(); 大概就是在网页加载完后，寻找class定义为easyui-tabs 的层。并把效果附加给他。 那么可以想象，当页面加载时，我们显示的是第一个view，那么js就找到view里的层，并赋予其效果。 然后我们在updatepanel里更新了显示的view，内容虽然切换到了第二个view了。但是页面没有重新加载，上面的js代码没有对新的view执行改变。 所以决策就是当updatepanel回发后重新执行js代码。 在页面定义一个重新绑定的函数。 复制代码 代码如下: function EndRequestHandler() { $(".easyui-tabs").tabs(); } 再定义一个事件。 复制代码 代码如下: function reload() { Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler); } add_endRequest PageRequestManager 类是一个管理浏览器中服务器 UpdatePanel 控件的部分页更新。此外，还定义一些属性、事件和方法，用以通过客户端脚本对网页进行自定义。通过调用 getInstance 方法来得到 PageRequestManager 类的实例。然后通过 add_endRequest 方法来绑定 endRequest 事件（异步回发完成，并且控制权返回到浏览器之后引发）。这样以后，每次updatepanel发生回调后，都会触发EndRequestHandler（）函数。重新绑定一次效果。$(document).ready(function() { reload(); }) 失效问题就解决了。

　　推荐阅读

　　json 入门学习笔记 示例代码

Json介绍： 　　JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。 json 官方网站 http://www.json.org/ json.net 下载地址 http://json.codeplex.com/releases/view/3>>>详细阅读

本文标题：在UpdatePanel内jquery easyui效果失效的解决方法

地址：http://www.17bianji.com/kaifa2/JS/26636.html

 1/2    1