ExtJS中的xtype类型

xtype Class
------------- ------------------
box Ext.BoxComponent 具有边框属性的组件
button Ext.Button  按钮
colorpalette Ext.ColorPalette 调色板
component Ext.Component 组件
container Ext.Container 容器
cycle Ext.CycleButton 
dataview Ext.DataView 数据显示视图
datepicker Ext.DatePicker 日期选择面板
editor Ext.Editor 编辑器
editorgrid Ext.grid.EditorGridPanel 可编辑的表格 
grid Ext.grid.GridPanel 表格
paging Ext.PagingToolbar 工具栏中的间隔
panel Ext.Panel 面板
progress Ext.ProgressBar 进度条
splitbutton Ext.SplitButton 可分裂的按钮
tabpanel Ext.TabPanel 选项面板
treepanel Ext.tree.TreePanel 树
viewport Ext.ViewPort 视图
window Ext.Window 窗口

工具栏组件有
---------------------------------------
toolbar Ext.Toolbar 工具栏
tbbutton Ext.Toolbar.Button 按钮
tbfill Ext.Toolbar.Fill 文件
tbitem Ext.Toolbar.Item 工具条项目
tbseparator Ext.Toolbar.Separator 工具栏分隔符
tbspacer Ext.Toolbar.Spacer 工具栏空白
tbsplit Ext.Toolbar.SplitButton 工具栏分隔按钮
tbtext Ext.Toolbar.TextItem 工具栏文本项

表单及字段组件包含:
---------------------------------------
form Ext.FormPanel Form面板 
checkbox Ext.form.Checkbox checkbox录入框
combo Ext.form.ComboBox combo选择项
datefield Ext.form.DateField 日期选择项
field Ext.form.Field 表单字段
fieldset Ext.form.FieldSet 表单字段组
hidden Ext.form.Hidden 表单隐藏域
htmleditor Ext.form.HtmlEditor html编辑器
numberfield Ext.form.NumberField 数字编辑器
radio Ext.form.Radio 单选按钮
textarea Ext.form.TextArea 区域文本框
textfield Ext.form.TextField 表单文本框
timefield Ext.form.TimeField 时间录入项
trigger Ext.form.TriggerField 触发录入项


如果要使输入域为密码类型可以使用

inputType: 'password'

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
ExtJS 是一个流行的 JavaScript 库,用于构建富交互式的 web 应用程序。它提供了丰富的组件和工具,可以帮助开发者快速构建功能强大、美观的用户界面。 以下是一个简单的 ExtJS 文示例: ```html <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <title>ExtJS 文示例</title> <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/extjs[email protected]/classic/theme-triton/resources/theme-triton-all.css"> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/extjs[email protected]/build/ext-all.js"></script> </head> <body> <script type="text/javascript"> Ext.onReady(function() { // 创建一个简单的窗口 var window = Ext.create('Ext.window.Window', { title: '欢迎使用 ExtJS', width: 400, height: 300, layout: 'fit', items: [{ xtype: 'panel', html: '<h1>你好,世界!</h1>' }] }); window.show(); }); </script> </body> </html> ``` 在这个例子,我们首先引入了 ExtJS 的样式和 JavaScript 文件。然后,使用 `Ext.onReady` 方法在页面加载完成后执行代码。 在代码,我们创建了一个简单的窗口并设置了标题、宽度和高度等属性。窗口包含一个面板,面板显示了一个带有标题的简单文本。 当页面加载完成后,我们调用 `window.show()` 方法将窗口显示在页面上。 这个示例演示了如何使用 ExtJS 创建一个简单的文窗口,并在其显示一些文本内容。通过使用 ExtJS 的丰富组件和工具,我们可以轻松地构建出功能强大、美观的 web 应用程序。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值