ExtJs的el和contentEl的区别

最新推荐文章于 2014-12-03 23:00:00 发布

最新推荐文章于 2014-12-03 23:00:00 发布 · 176 阅读

文章标签：

#EXT #HTML

ExtJs 专栏收录该内容

22 篇文章

订阅专栏

本文介绍了如何使用ExtJS将一个特定的HTML元素(div_exam)嵌入到面板(panel)中，以及如何将面板嵌入到HTML元素中。通过具体的JavaScript配置代码示例，展示了两种不同的实现方式及其对应的HTML结构。

1、把<div id="div_exam"></div>嵌入到当前Ext元素panel内:

Js代码
{
fieldLabel: "上传图片",
xtype: 'panel',
contentEl: 'div_exam'
}

{
fieldLabel: "上传图片",
xtype: 'panel',
contentEl: 'div_exam'
}
效果:

Html代码
<div class="x-panel-body x-panel-body-noheader" id="ext-gen155" style="width: 500px;">
<div id="div_exam"></div>
</div>

<div class="x-panel-body x-panel-body-noheader" id="ext-gen155" style="width: 500px;">
<div id="div_exam"></div>
</div>

2、.把当前Ext元素panel嵌入到<div id="div_exam"></div>内

Js代码
{
fieldLabel: "上传图片",
width: 200,
xtype: 'panel',
el: 'div_exam'

{
fieldLabel: "上传图片",
width: 200,
xtype: 'panel',
el: 'div_exam'
}
效果:

Html代码
<div id="div_exam">
<div class="x-panel-body x-panel-body-noheader" id="ext-gen155" style="width: 500px;">....</div>
</div>