tabs addTab时会重复触发tabload事件
本帖最后由 guatianshuileng 于 2023-11-27 17:18 编辑tabs添加并打开一个tab时,tabload事件会重复触发,触发次数是历史打开次数,请问是什么原因,代码如下:function openHistData(data) {
let row = grid.getSelected();
let tabs = window.parent.tabs;
//打开参数补录页面
let url = RootPath() + "/prod_operation_data.html";
if (tabs) {
let tab = {
name: 'prodOprationTab',
title: '参数录入',
url: url,
iconCls: 'fa fa-file-text-o',
showCloseButton: true
};
if (tabs.getTab(tab.name)){
tabs.removeTab(tab.name);
}
tab = tabs.addTab(tab);
tabs.activeTab(tab);
//tabload事件会被触发多次
tabs.on("tabload",function(e){
let tab=e.tab;
var iframe=tabs.getTabIFrameEl(tab);
let row = grid.getSelected();
let orgId = row.ORG_ID;
let stationId = row.STATION_ID;
let dateReport = row.DATE_REPORT;
let bcCode = row.BC_NAME;
//跨页面调用tab里面新页面的方法，传参数过去
iframe.contentWindow.openTab(orgId, stationId, dateReport, bcCode)
});
} else {
window.open(url, "_blank")
}
}
这代码提供的不太对吧？
事件如何绑定的贴一下 felt 发表于 2023-10-25 14:37 static/image/common/back.gif
这代码提供的不太对吧？
事件如何绑定的贴一下
不好意思,上次发帖后忘记持续关注了,代码已经重新粘贴了,您帮忙解答一下这个问题,谢谢 guatianshuileng 发表于 2023-11-24 16:25 static/image/common/back.gif
不好意思,上次发帖后忘记持续关注了,代码已经重新粘贴了,您帮忙解答一下这个问题,谢谢 ...
初始化的时候会默认加载首页，触发了一次，然后你新增操作的时候新增tab打开，又触发了一次啊.
你说的重复触发是指？ felt 发表于 2023-11-27 13:33 static/image/common/back.gif
初始化的时候会默认加载首页，触发了一次，然后你新增操作的时候新增tab打开，又触发了一次啊.
你说的重 ...
我是在当前tab页面1中打开tab页面2,在tabload事件中调用iframe.contentWindow.openTab()方法打开tab页面2中的弹窗,如果我把add的tab页面2关了,在tab页面1再打开tab页面2时,tabload事件中的iframe.contentWindow.openTab()会重复调用,重复次数是之前打开tab页面2的次数,打断点判断是tabload事件重复触发. guatianshuileng 发表于 2023-11-27 17:28 static/image/common/back.gif
我是在当前tab页面1中打开tab页面2,在tabload事件中调用iframe.contentWindow.openTab()方法打开tab页面2 ...
做个例子吧，可以基于我们试用包里面demo/tabs/load.html改造 本帖最后由 guatianshuileng 于 2023-11-28 15:44 编辑
felt 发表于 2023-11-27 17:58 static/image/common/back.gif
做个例子吧，可以基于我们试用包里面demo/tabs/load.html改造
load.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Tabs（懒加载）</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" />
<script src="../js/plugins/scripts/boot.js" type="text/javascript"></script>
</head>
<body>
<h1>Tabs（懒加载）</h1>
<input type="button" value="loadTabs" onclick="loadTabs()"/>
<input type="button" value="addTab" onclick="addTab()"/>
<input type="button" value="removeTab" onclick="removeTab()"/>
<input type="button" value="loadTab" onclick="loadTab()"/>
<br />
<div id="tabs1" class="mini-tabs" activeIndex="0" style="width:600px;height:350px;">
<div title="tab1" url="tab1.html">
1
</div>
<!--<div title="tab2" url="tab2.html">-->
<!--2-->
<!--</div>-->
</div>
<script type="text/javascript">
mini.parse();
var tabs = mini.get("tabs1");
function loadTabs() {
tabs.load("tabs.txt");
}
var index = 1;
function addTab() {
//add tab
var i = index++;
var tab = { title: "tab" + i, url: 'pages/page' + i + '.html', showCloseButton: true };
tab.ondestroy = function (e) {
var tabs = e.sender;
var iframe = tabs.getTabIFrameEl(e.tab);
//获取子页面返回数据
var pageReturnData = iframe.contentWindow.getData ? iframe.contentWindow.getData() : "";
alert(e.tab.removeAction + " : " + pageReturnData);
//如果禁止销毁的时候，自动active一个新tab：e.autoActive = false;
}
tabs.addTab(tab);
//active tab
tabs.activeTab(tab);
}
function removeTab() {
var tab = tabs.getActiveTab();
if (tab) {
tabs.removeTab(tab);
}
}
function onTabDestroy(e) {
//alert(e.tab.removeAction);
}
function loadTab() {
var tab = tabs.getActiveTab();
tabs.loadTab("pages/page1.html", tab);
}
tabs.on("beforecloseclick", function (e) {
if (e.tab.title == "Tab2") {
alert("Tab2不能关闭");
e.cancel = true;
}
});
</script>
<div class="description">
<h3>Description</h3>
<p>
点击tab页签时，其相关的页面才会被“懒加载”，而且只加载一次。<br />
Tab1演示了，只要点击就加载，加载多次。
</p>
</div>
</body>
</html>tab1.html<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../js/plugins/scripts/boot.js" type="text/javascript"></script>
</head>
<body>
page1.html<br />
Now：<div id="time"></div><br />
<input type="button" value="Close Tab" onclick="openTab2()"/>
</body>
</html>
<script type="text/javascript">
mini.parse();
var time = document.getElementById("time");
time.innerHTML = new Date().getTime();
function CloseWindow(action) {
if (window.CloseOwnerWindow) return window.CloseOwnerWindow(action);
else window.close();
}
function getData() { return "page1Data"}
function openTab2(){
var tabs = window.parent.tabs;
var tab = { title: "tab2", url: 'tab2.html', name: "tab2" };
if (tabs.getTab(tab.name)){
tabs.removeTab(tab.name);
}
tabs.addTab(tab);
tabs.activeTab(tab);
console.log(tabs.getTabs());
tabs.on("tabload", function (e) {
console.log(e.tab.title)
});
}
</script>
<script src="../../../scripts/jquery.min.js" type="text/javascript"></script>
<script>
$(document).on("mousedown", function (event) {
try {
var $ = top.jQuery;
$(top.document).trigger("topmousedown", );
} catch (ex) {
}
});
</script>
tab2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>tab2</title>
</head>
<body>
tab2
</body>
</html>执行结果:tab1.html的openTab2()方法中
tabs.on("tabload", function (e) {
console.log(e.tab.title)
});触发多次
guatianshuileng 发表于 2023-11-28 14:31 static/image/common/back.gif
load.htmltab1.htmltab2.html
执行结果:tab1.html的openTab2()方法中
tabs.on("tabload", fun ...
你这不是调用一次openTab2就绑定一次tabload事件？这能不多次吗？ felt 发表于 2023-11-28 16:25 static/image/common/back.gif
你这不是调用一次openTab2就绑定一次tabload事件？这能不多次吗？
找到原因了,之前也调用un解绑但是没效果,是调用un解绑的方法没有按miniui的格式写,解绑函数里function必须是具体方法名,多谢.
页:
[1]