1. Ext js怎么让Tabs的tab显示在左边右边或者下面,默认都是上面的。
你好,下面可以通过配置完成。但在左右,需要ul li也就是元素写出框架,html和css配合才能完成。
2. extjs做的界面,左边是树,点击每个树结点,右边切换不同的tabPanel,看清楚,不是切换页面哦!是tabPanel
1、点击树的节点触发test。参数为节点的id
listeners: {
itemclick: function(node,record) {
test(record.data.id);
}
}
2、test函数,在tabpanel中加入新面板。
var tp; // 你的tabpanel
function test(v) {
tp.add({
xtype: "panel",
html: "增加的面板",
}).show();
}
3. ExtJS给tabPanel添加图标如何实现?
Ext.create('Ext.tab.Panel', {
width: 300,
height: 200,
activeTab: 0,
items: [
{
title: 'Tab 1',
bodyPadding: 10,
iconCls:'你的图片样式',
html : 'A simple tab'
},
{
title: 'Tab 2',
iconCls:'你的图片样式',
html : 'Another one'
}
],
renderTo : Ext.getBody()
});
4. ExtJS:点击左边tree菜单,右边显示数据
Ext.onReady(function() { //只给leaf为true的节点加data,否则会与父节点展开事件发生冲突 var store = Ext.create("Ext.data.TreeStore", { root:{ expanded:true, children:[ { text:"detention", data:"html1.html", leaf:true }, { text:"homework", expanded:true, children:[ { text:"book report", data:"html2.html", leaf:true }, { text:"alegrbra", data:"html3.html", leaf:true } ] }, { text:"buy lottery tickets", data:"html4.html", leaf:true } ] } }); Ext.create("Ext.tree.Panel", { store:store, rootVisible:false, listeners:{ itemclick:function(v, r) { if (r.raw.data) { //获取节点的data的值 alert(r.raw.data); } } }, renderTo:Ext.getBody() });});
在后面的面板中加一个panel,设置其html为
再修改刚才的itemclick事件
document.getElementById('target').src = r.raw.data;
5. 怎样在Ext JS的tabPanel中嵌入Grid,求实例!谢谢,顺便说下,不懂的就请绕行,别废话!
从我的代码中摘出来的,没验证,你再调调。
TabPanel和Grid的定义就不贴了,只说怎么嵌入。
var tabpanel = Ext.getCmp("CenterTabPanel");
if (!tabpanel.getActiveTab()) {
var comp = Ext.getCmp("Gridid");
var firstTab = createTabPage(rootId, comp, "Sale");
tabpanel.add(firstTab);
tabpanel.setActiveTab(firstTab.id);
}
createTabPage = function (id, comp, icon) {
var tab = {
id: id,
iconCls: icon,
title: "xxxxx",
layout: 'fit',
layoutOnTabChange: true,
items: comp
};
return tab;
}
6. ext的TabPanel中tab过多,怎么实现下面这种方式?
如果答案满意,定加分! tabPanel是选项卡功能实现用到的 ,tablepanel没看到过 container>form>fieldset>anchor
7. Js 实现点击左侧a标签当点击每一个a,右面切换不一样的Div切换成另一个div
*{margin: 0;padding: 0;} #container{ height: 180px; width: 240px; margin: 200px auto; } #btn{ float: left; width: 60px; height: 180px; } #tab{ float: right; width: 178px; height: 178px; margin-left: -180px; border: 1px solid black; position: relative; } .tab_btn{ display: block; width: 58px; height: 58px; background: green; line-height: 60px; text-align: center; border: 1px solid red; text-decoration: none; color: black; } .tab_btn:hover{ background: blue; color: white; } .tab_div{ position: absolute; left: 0px; top: 0px; display: none; } .curr_btn{ background: blue !important; color: white; } .curr_div{ display: block !important; } function getClass(className) { //className指class的值 var tagname = document.getElementsByTagName('*'); //获取指定元素 var tagnameAll = []; //这个数组用于存储所有符合条件的元素 for (var i = 0; i =0){ //如果获得的元素中的class的值等于指定的类名,就赋值给tagnameAll tagnameAll[tagnameAll.length] = tagname[i]; } } return tagnameAll; } window.onload=function(){//载入事件 var btn=getClass('tab_btn');//获取按钮数组 var div=getClass('tab_div');//获取div数组 for(i=0;i=0) return;//如果按下的按钮为当前选中的按钮则无反应 for(i=0;i 1 2 3 div1 div2 div3
效果如上
8. extjs中如何令Ext.tab.Panel像div一样,定位浮动在页面
思路是这样:弹窗用window。window里面放登陆的表单。你说的Ext.tab.Panel是可切换标签页的panel。这里可以不用。
弹出window 几定位的部分代码可以参考
var p = new Ext.form.FormPanel({
......// 里面放登陆表单元素
});
var w = new Ext.Window({
items:[p],
......// 其他你需要的元素。
});
a.show(); // 弹出窗口
a.setPosition( Number left, Number top ) // 设置位置的方法,一般来说window会默认弹出在页面的中间。