<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ExtJS Example</title> <link rel="stylesheet" type="text/css" href="path/to/ext-all.css" /> <script type="text/javascript" src="path/to/ext-all.js"></script> <script type="text/javascript"> Ext.onReady(function() { var panel = Ext.create('Ext.panel.Panel', { title: 'My Panel', width: 300, height: 200, renderTo: Ext.getBody(), items: [ { xtype: 'textfield', fieldLabel: 'Name', anchor: '100%' }, { xtype: 'button', text: 'Submit', handler: function() { Ext.Msg.alert('Info', 'Button clicked!'); } } ] }); }); </script> </head> <body> </body> </html>
我们首先引入了ExtJS的CSS和JavaScript文件。然后,在Ext.onReady函数中创建了一个面板(Panel),并在个中添加了一个文本字段(Textfield)和一个按钮(Button)。文本字段用于吸收用户输入,而按钮则绑定了一个点击事宜处理程序,当按钮被点击时会弹出一个框。
上述代码中的path/to/ext-all.css和path/to/ext-all.js须要更换为实际的ExtJS库文件路径。
