I recently studied MenuButton and got a new feeling. I used to right-click the support method in that DEMO. Now it seems that I am a little pediatrics. I am doing some preparation in the early stage:
1. Download the DEMO source code and upgrade it to the latest version (jquery 1.7.2, Easyui 1.2.6). You can directly replace it. To upgrade easyui, replace all css js theme.
2. In the HTML code of the homepage:
The Code is as follows:
Refresh
Close
Close all
Disable all of these
Close all on the right of the current page
Close all on the left of the current page
Exit
Changed:
The Code is as follows:
Refresh
Close
Close all
Disable all of these
Close all on the right of the current page
Close all on the left of the current page
Exit
Add a new method to outlook2.js as follows:
The Code is as follows:
Function closeTab (action)
{
Var alltabs = $ ('# tabs'). tabs ('tabs ');
Var currentTab = $ ('# tabs'). tabs ('getselected ');
Var allTabtitle = [];
$. Each (alltabs, function (I, n ){
AllTabtitle. push ($ (n). panel ('options'). title );
})
Switch (action ){
Case "refresh ":
Var iframe = $ (currentTab. panel ('options'). content );
Var src = iframe. attr ('src ');
$ ('# Tabs'). tabs ('update ',{
Tab: currentTab,
Options :{
Content: createFrame (src)
}
})
Break;
Case "close ":
Var currtab_title = currentTab. panel ('options'). title;
$ ('# Tabs'). tabs ('close', currtab_title );
Break;
Case "closeall ":
$. Each (allTabtitle, function (I, n ){
If (n! = OnlyOpenTitle ){
$ ('# Tabs'). tabs ('close', n );
}
});
Break;
Case "closeother ":
Var currtab_title = currentTab. panel ('options'). title;
$. Each (allTabtitle, function (I, n ){
If (n! = Currtab_title & n! = OnlyOpenTitle)
{
$ ('# Tabs'). tabs ('close', n );
}
});
Break;
Case "closeright ":
Var tabIndex = $ ('# tabs'). tabs ('gettabindex', currentTab );
If (tabIndex = alltabs. length-1 ){
Alert ('Kiss, no more later ^ @ ^ !! ');
Return false;
}
$. Each (allTabtitle, function (I, n ){
If (I> tabIndex ){
If (n! = OnlyOpenTitle ){
$ ('# Tabs'). tabs ('close', n );
}
}
});
Break;
Case "closeleft ":
Var tabIndex = $ ('# tabs'). tabs ('gettabindex', currentTab );
If (tabIndex = 1 ){
Alert. ^ @ ^ !! ');
Return false;
}
$. Each (allTabtitle, function (I, n ){
If (I <tabIndex ){
If (n! = OnlyOpenTitle ){
$ ('# Tabs'). tabs ('close', n );
}
}
});
Break;
Case "exit ":
$ ('# CloseMenu'). menu ('hide ');
Break;
}
}
Change the tabCloseEven method in js
The Code is as follows:
Function tabCloseEven (){
$ ('# Mm'). menu ({
OnClick: function (item ){
CloseTab (item. id );
}
});
Return false;
}
This is OK, and the code is much more elegant than the original one!
Call refresh. When the current tag is closed, closeTab ('action') is called. // the action can be refresh or close)
Top. closeTab ('action ');
Click here to download the latest Easyui application instance