案例:Extjs案例     状态:可编辑再运行    进入竖版
 运行结果 
x
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
   <link href="//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />
5
   <script type="text/javascript" src="//cdn.bootcss.com/extjs/6.2.0/ext-all.js"></script>
6
   <script type="text/javascript">
7
      Ext.onReady(function() {
8
         Ext.create('Ext.Button', {
9
            renderTo: Ext.getElementById('msgBox'),
10
            text: 'Click Me',
11
            listeners: {
12
               click: function() {
13
                  Ext.MessageBox.show({
14
                     title: 'Details',
15
                     msg: 'Please enter your details:',
16
                     width:300,
17
                     buttons: Ext.MessageBox.OKCANCEL,
18
                     multiline: true,
19
                     fn: callbackFunction
20
                  });
21
22
                  function callbackFunction (){
23
                     Ext.Msg.alert('status', 'Details entered succesfully');
24
                  }
25
               }
26
            }
27
         });
28
      });
29
   </script>
30
</head>
31
<body>
32
   <p> Click the button for alert box </p>
33
   <div id = "msgBox" ></div>
34
</body>
35
</html>