• Ext js-01 -helloworld


    一、下载ext:  

    登陆这个网址  https://www.sencha.com/products/evaluate/  

     下载下来解压后如下:安装cmd程序

    二、开始helloworld

    新建一个idea的web项目,在web目录下建一个ext目录,ext目录下建一个classic目录,在classic目录下,建一个locale目录,把下载好的EXT文件ext-6.5.3uildclassiclocale 目录下的locale-zh_CN.js文件复制进去,把ext-6.5.3uildclassic 目录下的 theme-triton 文件夹里的所有文件拷贝到项目的classic目录下,ext-6.5.3uild 目录下的ext-all.js拷贝到项目ext目录下,结构如下:

    新建一个hello.html编写如下代码:

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>ext js入门</title>
     6     <!-- 引入ext js 的样式文件-->
     7     <link rel="stylesheet" type="text/css" href="ext/classic/theme-triton/resources/theme-triton-all.css" />
     8     <!-- 引入ext js的核心库-->
     9     <script src="ext/ext-all.js"></script>
    10     <script>
    11        // alert("js原生弹出框 :hello");
    12         Ext.MessageBox.alert("Ext 弹出框:hello")
    13     </script>
    14 </head>
    15 <body>
    16 
    17 </body>
    18 </html>

    用浏览器打开,并打开调试窗口,发现报错了,没有定义alert,

     这是因为和jQuery一样,也需要先加载上下文,先等待 Ext框架初始化完成,才能使用

    代码修改如下,在浏览器里运行html,弹出框正弹出

    Ext.onReady(function(){
    Ext.MessageBox.alert('Ext弹出框','hello world');
    })
      

      

     ext 官方api地址 http://docs.sencha.com/extjs/6.5.3/guides/getting_started/getting_started.html 

  • 相关阅读:
    java-工具代码
    idea-常用快捷键
    idea-环境配置
    mysql-常用命令
    Java IO流学习总结
    Java类加载机制
    Struts2标签 %{ } %{# }详解
    EL语法
    SQL语句
    在servlet转向jsp页面的路径问题
  • 原文地址:https://www.cnblogs.com/enjoyjava/p/8976252.html
Copyright © 2020-2023  润新知