您的位置：首页 > 产品设计 > UI/UE

easyui-tab href,content区别

2016-01-07 15:05 519 查看

easyUI的Tab面板是继承了panel

说明：jsp主页面添加一个id为tab的div，要引入easyUI的相关js、css

<div data-options="region:‘center‘" >
<div id="tab" class="easyui-tabs" fit="true">
<div title="主页"></div>
</div>
</div>

第一种，使用content：
/添加tab，这里有一个name属性

function f_addTab(name,tabId,title,url){
if ($("#tab").tabs(‘exists‘, tabId)) {
$(‘#tab‘).tabs(‘select‘, tabId);
// $(‘#‘+tabId).attr(‘src‘,url);//刷新
} else {
$(‘#tab‘).tabs(‘add‘,{
id:tabId,
title:title,
content:‘<iframe name="‘+name+‘" src="‘+url+‘" frameborder="0"       style="height:100%;width:100%;" "></iframe>‘,
closable:true ,//tab显示关闭键
cache:true //设置缓存，如果为false，在每次选中所选的tab时，都会加载一次页面内容
});
}
}

第二种，使用href：

function f_addHref(tabId,title,hrefUrl){
if ($("#tab").tabs(‘exists‘, tabId)) {
$(‘#tab‘).tabs(‘select‘, tabId);
$(‘#‘+tabId).attr(‘src‘,url);//刷新
} else {
$(‘#tab‘).tabs(‘add‘,{
id:tabId,
title:title,
href:hrefUrl,
closable:true ,
cache:true
});
}
}

第一种和第二种的区别：

content属性是添加整个url请求中完整的jsp页面，而href属性只引入url中的<body></body>中的内容，具体可参考这个网站：
http://www.jeasyuicn.com/post-49.html
如果使用href创建tab，那么使用datagrid时，每个页面的grid的id都不能重名，否则会无法显示，因为href属性是不断在原来的页面插入url中请求的页面内容，一旦datagrid的id重名，那么在第二个datagrid就会无法显示

引入easyUI的相关js文件区别：

如果使用href创建tab，那么只要在主页中引入相关的easyUI的js、css文件就可以了；
如果使用content创建tab，那么每个页面都要引入相关的easyUI的js、css文件

href,content的区别，写得比较详细的一篇文章，大家可参考一下： http://www.easyui.info/archives/164.html

本文摘自：http://www.mamicode.com/info-detail-37998.html

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航