Extjs框架知识总结

最新推荐文章于 2023-06-17 23:14:54 发布

zsw119

最新推荐文章于 2023-06-17 23:14:54 发布

阅读量3.1k

点赞数 1

文章标签： xhtml html javascript

本文链接：https://blog.csdn.net/zsw119/article/details/122492416

版权

概述
Ext是基于Web的富客户端框架，其完全是基于标准W3C技术构建的，使用到的都是HTML、CSS、DIV等相关技术。Extjs提供了大量已经封装好的可以直接使用的组件，上手容易。以下是基于Extjs框架整合的demo。

Extjs框架可分为五个部分：

HTML页面：加载js插件，承载界面显示
Controller.js：控制各个组件，以及实现事件监听
View.js：实现页面的布局
Store.js：提供数据信息，可以通过代理向后台获取表单数据
Model.js：数据保存模块，用于保存Store获取的数据
以下是各个模块实现是代码示例：
HTML页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Extjs示例</title>
<link href="ext-4.2/resources/css/ext-all-gray.css" rel="stylesheet"/>
<link href="resources/css/icon.css" rel="stylesheet"/>
<script src="ext-4.2/ext-all.js"></script>
<script src="ext-4.2/locale/ext-lang-zh_CN.js"></script>
<script src="common.js"></script>
<style type="text/css">
.photo_css1 {
height: 18px;
width: 66px;
cursor: pointer;
}

.photo_css2 {
display: none;
}
</style>
</head>
<body>

</body>
<script>
Ext.application({
name: 'Cnu',
controllers: ['Cnu.controller.CheckSummaryController'],
launch: function () {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [{
xtype: 'CheckSummaryView'
}]
});
}
});
</script>
</html>

zsw119

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Extjs框架知识总结

概述Ext是基于Web的富客户端框架，其完全是基于标准W3C技术构建的，使用到的都是HTML、CSS、DIV等相关技术。Extjs提供了大量已经封装好的可以直接使用的组件，上手容易。以下是基于Extjs框架整合的demo。Extjs框架可分为五个部分：HTML页面：加载js插件，承载界面显示Controller.js：控制各个组件，以及实现事件监听View.js：实现页面的布局Store.js：提供数据信息，可以通过代理向后台获取表单数据Model.js：数据保存模块，用于保存Store获
复制链接

扫一扫