+ -
当前位置:首页 → 问答吧 → extjs tab 标签上方的汉字显示不全

extjs tab 标签上方的汉字显示不全

时间:2011-11-19

来源:互联网

开发用的extjs4,如下图,“来宾用餐申请”,中文几个字的最上面被消去了,怎么设置正确呢?
是点击左面的树,弹出的tab页。
先是建立的tabpanel,然后在点击函数中,添加tab。

var center_panel=Ext.createWidget('tabpanel',
  {
  id:'panleCenter',
  region:'center',
  plain:true,
  frame:false,
  border:false,
  split:true,
  activeTab: 0,
  defaults :{
  bodyPadding: 10
  },
  items: [  
  {
  closable: true,
  xtype:"panel",layout:'fit',title:' ',border:false,frame:false,iconCls: 'indexicon',  
  html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='Page/BAS/HomePage.htm'></iframe>"
  }
  ]
  });

  function tabadd(rec)
  {
  var tab = center_panel.add({
  closable: true,
  title: rec.raw.text, //tab页名称
  xtype:"panel",layout:'fit',border:false,frame:false,  
  html:"<iframe scrolling='no' width='100%' height='100%' frameborder='0' src='"+rec.raw.url+"'></iframe>"
  });
  center_panel.setActiveTab(tab);
  }

作者: yangzhuofeng   发布时间: 2011-11-19

rec.raw.text 是定义的tab页名称,是一个变量,如来宾用餐记录

作者: yangzhuofeng   发布时间: 2011-11-19

看下例在panel的标题中添加一个空格&nbsp;即可。在extjs4.0中调试过。
var myPanel1=Ext.create('Ext.panel.Panel',{
      title:'&nbsp;基本信息',
     //region:'south',        //组件布局区域
     containerScroll:true,//是否有滚动条
   collapsible: true,        //是否可收缩
   items:[myForm1]
   });
var myPanel2=Ext.create('Ext.panel.Panel',{
        title:'&nbsp;个人信息',
               height:600,
               width:600,
            containerScroll:true,//是否有滚动条
            collapsible: true,        //是否可收缩
                items:[myForm2]
        });
        var myPanel3=Ext.create('Ext.panel.Panel',{
                title:'&nbsp;个人照片',
               height:600,
               width:900,
            containerScroll:true,//是否有滚动条
            collapsible: true,        //是否可收缩
                items:[myForm3]
        });
       
var mytab = Ext.create('Ext.tab.Panel',{
        id:'mytab',
        region:'center',
        height: 680,
        width:'60%',
                pressed:true,
        activeTab: 0,//默认激活第一个tab页面
        //defaults:{bodyStyle:'padding:10px'},
            containerScroll:false,
            items:[myPanel1,myPanel2,myPanel3],
            buttons:[
                    {id:'send',  text:'提交',handler: fnSaveRecord},
                    {id:'cancel',text:'取消'}
            ]
        });

作者: zxywolf   发布时间: 2012-10-05