Extjs案例 - W3xue在线HTML/CSS/JS运行工具

<!DOCTYPE html>
<html>
<head>
   <link href="//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />
   <script type="text/javascript" src="//cdn.bootcss.com/extjs/6.2.0/ext-all.js"></script>
   <script type="text/javascript">
      Ext.onReady(function() {
         Ext.create('Ext.Button', {
            renderTo: Ext.getElementById('msgBox'),
            text: 'Click Me',
            listeners: {
               click: function() {
                  Ext.MessageBox.show({
                     title: 'Details',
                     msg: 'Please enter your details:',
                     width:300,
                     buttons: Ext.MessageBox.OKCANCEL,
                     multiline: true,
                     fn: callbackFunction
                  });

function callbackFunction (){
                     Ext.Msg.alert('status', 'Details entered succesfully');
                  }
               }
            }
         });
      });
   </script>
</head>
<body>
   <p> Click the button for alert box </p>
   <div id = "msgBox" ></div>
</body>
</html>

​x
 
<!DOCTYPE html>
<html>
<head>
   <link href="//cdn.bootcss.com/extjs/6.2.0/classic/theme-classic/resources/theme-classic-all.css" rel="stylesheet" />
   <script type="text/javascript" src="//cdn.bootcss.com/extjs/6.2.0/ext-all.js"></script>
   <script type="text/javascript">
      Ext.onReady(function() {
         Ext.create('Ext.Button', {
            renderTo: Ext.getElementById('msgBox'),
            text: 'Click Me',
            listeners: {
               click: function() {
                  Ext.MessageBox.show({
                     title: 'Details',
                     msg: 'Please enter your details:',
                     width:300,
                     buttons: Ext.MessageBox.OKCANCEL,
                     multiline: true,
                     fn: callbackFunction
                  });
​
                  function callbackFunction (){
                     Ext.Msg.alert('status', 'Details entered succesfully');
                  }