Example code Description: jqueryeasyui dynamic tab page _ jquery

This article mainly introduces the information about the jqueryeasyui dynamic tab page in the example code. For more information about how to use jQuery EasyUI, you can easily add Tabs. You only need to call the 'add' method.

Function addTab (title, href, icon) {var tt = $ ('# tabs'); if (tt. tabs ('exists', title) {// If a tab already exists, select and refresh the tab tt. tabs ('select', title); refreshTab ({tabTitle: title, url: href});} else {if (href) {var content = '';} else {var content = 'unimplemented ';} tt. tabs ('add', {title: title, closable: true, content: content, iconCls: icon | 'icon-default '});}} /*** refresh the tab * @ cfg * example: {tabTitle: 'tabtitle', url: 'refr Eshurl'} * If tabTitle is empty, the selected tab is refreshed by default. * If the url is empty, the original url is reload */function refreshTab (cfg) by default) {var refresh_tab = cfg. tabTitle? $ ('# Tabs '). tabs ('gettab', cfg. tabTitle): $ ('# tabs '). tabs ('getselected'); if (refresh_tab & refresh_tab.find ('iframe '). length> 0) {var _ refresh_ifram = refresh_tab.find ('iframe') [0]; var refresh_url = cfg. url? Cfg. url: _ refresh_ifram.src; // _ refresh_ifram.src = refresh_url; _ refresh_ifram.content?location.href = refresh_url ;}

The above code is easy to understand. The code is a comment. If you have any questions, please leave a message.

Ps: jQuery Easyui's tabs plug-in can load content on a tab in two ways: "href remote request" and "content local content ".

Features:

Features of href data loading:

Only the content inside the body element of the loaded page is loaded. That is, jQuery's ajax request only contains html fragments.
When loading a remote url, there is a mask effect, that is, "waiting ......" Results: better user experience.
When the page layout to be loaded is complex, or a large number of js scripts need to be run, the encoding usually requires caution, which is prone to problems and will be discussed in detail later.

Data Loading using content:

Flexible. You can spell the html code in the script and assign the content attribute to the tab. However, this write method will make the code easier to understand.
You can assign an iframe to the content and embed an iframe.
Using iframe will cause repeated loading of client js and waste of resources. For example, if you want to reference the easyui library on your homepage, your iframe will also be referenced.