1、tabs的常用操作
//1.判断tab是否存在。 var currtab = $('#tabs').tabs('getSelected'); //2.判断点击的tab是否是当前选中的tab。 var currtab = $('#tabs').tabs('getSelected'); var tab = $("#tabs").tabs("getTab", title); if (currtab == tab) { ... } //3.是当前tab时，刷新。 var url = $(currtab.panel('options').content).attr('src'); refreshTab(tab, url); //4.不是当前tab时，转换当前选中的tab，在刷新！ var tab = $("#tabs").tabs("select", title); var currtab = $('#tabs').tabs('getSelected'); var url = $(currtab.panel('options').content).attr('src'); refreshTab(tab, url); //5.更新tab 对应的iframe 公用的方法 function refreshTab(obj,url) { var refresh_tab = obj; if (refresh_tab && refresh_tab.find('iframe').length > 0) { var _refresh_ifram = refresh_tab.find('iframe')[0]; _refresh_ifram.contentWindow.location.href = url; } }
2、实战应用
html标签
<body class="easyui-layout" > <div id="mytabs" class="easyui-tabs" fit="true"> <div id="task" title="任务下发" data-options="iconCls:'icon-task',closable:false" style="padding: 10px;border: 0px;height: 100%;" > <iframe id="iframeTask" name="iframeTask" src="qualityTask.jsp" style=" 100%;height: 100%;border: 0px;"></iframe> </div> <div id="track" title="任务跟踪" data-options="iconCls:'icon-track',closable:false" style="padding: 10px;height: 100%;" data-options=""> <iframe id="iframeTrack" name="iframeTrack" src="qualityTrack.jsp" style=" 100%; height: 100%;border: 0px;"></iframe> </div> <div id="report" title="报表分析" data-options="iconCls:'icon-report',closable:false" style="padding: 10px;height: 100%;"> <iframe id="iframeReport" name="iframeReport" src="qualityReport.jsp" style=" 100%; height: 100%;border: 0px;"></iframe> </div> </div> </body>
JS代码
var count=0; $(document).ready(function(){ $('#mytabs').tabs({ border:false, onSelect:function(title){ if(title=='任务下发'&&count!=0){ //var iframeTask=iframeTask.window.document.getElementById("iframeTask"); var l=window.location; var reqUrl = l.protocol + "//" +l.host+"/wtms/pages/quality/qualityTask.jsp"; $("#iframeTask").attr("src",reqUrl); }else if(title=='任务跟踪'){ count=1; //var iframeTrack=iframeTrack.window.document.getElementById("iframeTrack"); var l=window.location; var reqUrl = l.protocol + "//" +l.host+"/wtms/pages/quality/qualityTrack.jsp"; $("#iframeTrack").attr("src",reqUrl); }else if(title=='报表分析'){ count=1; // var iframeReport=iframeReport.window.document.getElementById("iframeReport"); var l=window.location; var reqUrl = l.protocol + "//" +l.host+"/wtms/pages/quality/qualityReport.jsp"; $("#iframeReport").attr("src",reqUrl); } } }); });