Extjs 中在一個Panel中嵌入html元素

 

代碼示例：

var menuPanel = new Ext.Panel({
	region : "north",
	//autoHeight : true,
	split : true,
	layout : "fit",
	border : false,
	contentEl : "north",
	height:90,
	collapseMode : "mini",
   	html:"<table cellpadding='0' cellspacing='0' style='width:100%; height:100%; font-size: 12; border: 0; '  style='background: #CAE1FF;'><tr>"+
                    "<td width='10%' style='padding-left:30;'><font color='#66B3FF' size='6'><b><i>一卡通信息管理平臺</i></b></font>"+
                    "</td>"+
                    "<td width='10%' align='right' valign='top' style='background: #CAE1FF;'> </td>"+
                    "<td width='10%' align='right' valign='top' style='background: #CAE1FF;'> </td>"+
                    "<td width='35%' align='right' valign='top' style='background: #CAE1FF;'> </td>"+
                    "<td width='35%' align='right' valign='top' style='background: #CAE1FF;'><a href='./jxy/userExitAction'><img src='./Image/CardSystem/cancel.png'></img><font color='red'>用戶退出</font></a>  <a href='welcome.jsp'><img style='margin-top:5px;' src='./ExtJs/control_images/icons/indexicon.gif'></img><font color='green'>返回主頁</font></a></td>"+
             "</tr><tr style='background: #CAE1FF;'>"+
             "<td width='50%' style='padding-left:10;'><font color='#4D4D4D' size='2'><b>操作員：" + userTrueName + "      角色：" + userRole +"      組織：" + userOrgan + "</b></font></td>"+
             "<td width='10%'> </td>"+
             "<td width='10%'> </td>"+
             "<td width='35%'> </td>"+
             "<td width='35%'> </td>"+
             "</tr></table>"	
});

在Panel的屬性中有一個是html，屬性值中就可以定義網頁元素，和在html文件中寫法一樣的。