我在项目的局部视图中放了一些
jquery选项卡.我注意到Visual Studio的“解决方案资源管理器”,在调试期间,每次单击新选项卡时都会生成一个新的动态JScript脚本块.
即使我把$(‘#mytabs .ui-tabs-hide’).children().remove();和$(“.ui-tabs-hide”).empty();里面显示标签的事件.
脚本块包含我置于选项卡调用的部分视图中的javascript,因此每次单击之前单击的选项卡时,都会出现一个新的JScript块:很明显这会导致稳定性或内存泄漏问题…例如,I已经注意到我加载两次选项卡后,某些计时器和绑定无法正常工作.
我不知道问题是由调用包含脚本的部分视图的方式引起的.请注意我如何设置控制器操作(示例中的索引).
这是我的环境:jquery 1.6.4 – jquery-ui 1.8.16 – IE 8.0.7601
我无法使用其他浏览器进行调试,因为Visual Studio似乎没有附加其进程并且不显示动态数据…
CONTROLLER
这是选项卡调用的动作示例
public ActionResult Index() { if (Request.IsAjaxRequest()) return PartialView("_Index"); return View(); }
以下是我的观点和脚本的一些部分:
_Layout.cshtml
.... <div id="body"> @Html.Partial("_TabsMenu"); </div> ....
<div id="menutabs" class="content-wrapper"> <ul > <li>@Html.ActionLink("Home","Index","Home")</li> <li>@Html.ActionLink("Test","Test")</li> ... </ul> </div> <script type="text/javascript"> $(function () { $('#menutabs').tabs({ cache: false,show: function (event,ui) { $('#menutabs .ui-tabs-hide').children().remove(); // the content is removed,but the script is still in memory $(".ui-tabs-hide").empty(); // the content is removed,but the script is still in memory },select: function (event,ui) { $(window).unbind(); } }); });
(我甚至试图把脚本放在div id里面,pheraps很傻,但是我想看看DOM中的脚本是否被移除了……但是什么都没有)
Index.cshtml
@{Html.RenderPartial("_Index");}
_Index.cshtml(包含问题的重复jscript对象的局部视图)
<table id="list4"></table> <jQuery("#list4").jqGrid({ datatype: "local",height: 250,colNames:['Inv No','Date','Client','Amount','Tax','Total','Notes'],colModel:[ {name:'id',index:'id',width:60,sorttype:"int"},{name:'invdate',index:'invdate',width:90,sorttype:"date"},{name:'name',index:'name',width:100},{name:'amount',index:'amount',width:80,align:"right",sorttype:"float"},{name:'tax',index:'tax',{name:'total',index:'total',{name:'note',index:'note',width:150,sortable:false} ],multiselect: true,caption: "Manipulating Array Data"}); var mydata = [ {id:"1",invdate:"2007-10-01",name:"test",note:"note",amount:"200.00",tax:"10.00",total:"210.00"},{id:"2",invdate:"2007-10-02",name:"test2",note:"note2",amount:"300.00",tax:"20.00",total:"320.00"},{id:"3",invdate:"2007-09-01",name:"test3",note:"note3",amount:"400.00",tax:"30.00",total:"430.00"},{id:"4",invdate:"2007-10-04",{id:"5",invdate:"2007-10-05",{id:"6",invdate:"2007-09-06",{id:"7",{id:"8",invdate:"2007-10-03",{id:"9",total:"430.00"} ]; for(var i=0;i<=mydata.length;i++) jQuery("#list4").jqGrid('addRowData',i+1,mydata[i]);
更新
JScript – 脚本块1..N //这是我在每个JScript脚本块中看到的,在调试期间……我是testint jqgrid.这是一个demo from Trirand’s site.
<jQuery("#list4").jqGrid({ datatype: "local",mydata[i]);