- 昨天開始搭后臺框架，到晚上的時候遇到了一個現在覺得挺可笑但是當時一直很糾結很糾結的問題，這個問題剛剛解決出來，把它拿出來說說，讓自己長點兒記性，希望大家不要犯我這個錯誤啊??
- 在backstage.jsp頁面中我寫了一個方法，用于在指定位置添加面板（id為msg的地方）??
- function?addTab(t,h){??
- ????if($('#msg').tabs('exists',t)){??
- ????????$('#msg').tabs('select',t);??
- ????}else{??
- ????????$('#msg').tabs('add',{??
- ????????????????title:t,??
- ????????????????href:h??
- ????????});??
- ????}??
- }??
- 在body方法中有一個超連接??
- <a?id="admins">查看管理員信息</a>??
- 方法調用??
- $("#admins").click(function(){??
- ????????????addTab('管理員信息','${?pageContext.request.contextPath}/backstage/admins/findAdmins.jsp');??
- ????????});??
- findAdmins.jsp??
- <head>??
- <script>??
- $(function(){??
- ????????????alert("------");??
- });??
- </script>??
- </head>??
- <body>??
- ????這是findAdmins.jsp頁面，事件觸發啦??
- <body>??
- 我遇到的問題就是，當添加面板時，findAdmins.jsp中body中的內容都會顯示，但head中的方法就是不執行，剛開始覺得是路徑問題，但如果是路徑問題的話為什么body中的內容能夠正確顯示呢？??
- 這個問題想得我頭疼啊，到底是為什么呢，就是想不明白??
- 下面我來回答一個我自己的這個問題吧，其發生這種事情的主要原因還是因為我很多東西都不知道，看的東西也比較少。??
- Href方式加載數據有幾個特點：??
- 第一個就是被加載的頁面只有body元素內部的內容才會被加載，也就是jQuery的ajax請求的只是html片段。（各位包括我自己，這種問題一定要注意啊）還有就是在加載遠程url時有遮罩效果，也就是“等待中……”效果，用戶體驗較好。???
- 但是當加載的頁面布局較為復雜，或者有較多的js腳本需要運行的時候，編碼往往就需要謹慎了，容易出問題。下面說一些在網上找到的一個href的常見問題??
- 1.href只加載目標URL的html片段??
- 這個特性是由jQuery封裝的ajax請求處理機制所決定的，所以目標URL頁面里不需要有html,head,body等標簽，即使有這些元素，也會被忽略，所以放在head標簽里面的任何腳本也不會被引入或者執行。??
- 2.短暫的頁面混亂：??
- href鏈接的頁面比較復雜的時候，easyui對其渲染往往需要一個較長的過程，這時候，加載進來的html片段毫無布局可以，過一會自動會好，這時候easyui已經完成對它的渲染。如何避免這個混亂的過程呢，還得靠easyui的一個基礎插件——解析器(Parser)。??
- Parser有個onComplete事件，這個事件就是指easyui對頁面完成渲染時觸發，這樣思路就很清晰了：用一個div遮罩住讓被加載進來的html片段，在onComplete事件中，讓這個div淡出，這時候渲染好的html片段就能美人出浴了，同時還整了個等待中的效果，一舉兩得。這樣要做兩件事：??
- 第一是在要加載的html片段中放一個遮罩用的div：??
- <div?id='loading'?style="position:absolute;z-index:1000;top:0px;left:0px;width:100%;height:100%;background:#DDDDDB;text-align:center;padding-top:?20%;">??
- ????<image?src='style/images/loading.gif'/>???
- </div>??
- 第二是在被加載的html片段尾部處理相關事件：??
- <script>??
- ????function?show(){??
- ????????$("#loading").fadeOut("normal",?function(){??
- ????????????$(this).remove();??
- ????????});??
- ????}??????
- ????var?delayTime;??
- ????$.parser.onComplete?=?function(){??
- ????????if(delayTime)???
- ????????????clearTimeout(delayTime);??
- ????????delayTime?=?setTimeout(show,500);??
- ????}??
- </script>??
- 需要注意的是，如果多個tab頁面都使用了onComplete事件，當前定義的會覆蓋之前定義的。其實每次easyui渲染完成均會調用onComplete事件，所以每打開一個包含easyui控件的tab頁，onComplete事件就會被調用。??
- 3.html片段的easyui組件相關腳本莫名地報錯：??
- 其實這個現象是跟第一個現象的原因一樣的，easyui完成對html片段渲染需要一定的時間，頁面越復雜，耗時越長，這時候難以避免html存在的腳本存在對easyui某些插件的調用，比如datagrid等，這個時候就會報錯，解決方案同上，將這些腳本放到onComplete事件里處理，也就保證了渲染完成前，不會被執行。??
- 4.放在window里面表單驗證的提示信息會亂串：??
- 這個現象應該是插件自身的bug，對位置的計算沒有考慮到這些特殊的事情，解決方式可以投機取巧，在打開window后，讓表單不符合驗證的input獲得焦點就可以了。??
- content方式加載數據的特點：??
- 1.??比較靈活，你可以在腳本里面拼寫html代碼，然后賦值給tab的content屬性，不過這種寫法會使得代碼易讀性變差。???
- 2.??可以把iframe賦給content，把一個iframe嵌入也就沒有什么不能完成的了。???
- 3.??使用iframe會造成客戶端js重復加載，浪費資源，比如說你主頁面要引用easyui的庫，你的iframe也要引用，浪費就產生了。???
- 希望能對大家有點兒幫助，不要再犯這種錯誤啦！！
轉載于:https://www.cnblogs.com/Struts-pring/p/5138728.html
)
)
