来源:http://www.ourjs.cn 原文: http://www.ourjs.cn/show.php?id=698
JX项目地址:http://jx.myofiz.com/ ,它的作者是Santosh Rajan,他说他的这个作品是“jQuery的一个面向对象形式的扩展”(众所周知,jQuery确实不像Mootools那样‘面向对象’)。
这个基于JavaScript的布局管理器的特性如下:
- 很小,在压缩条件下,它只有8K大小
- 真的是一个面向对象的jQuery扩展!!!
- 可以通过嵌套实现复杂的布局
- 可以通过对象继承来实现扩展
- 只可惜目前该代码的浏览器兼容性问题未完全解决,IE6下显示会有问题
看看如下代码有何感想?
JAVASCRIPT:
-
-
$(document).ready(function() {
-
var viewport = new JX.Viewport({
-
css: {padding: '0px', margin: '0px'},
-
items: [{
-
height: 50,
-
css: {backgroundColor: '#aaaaaa', padding: '20px'},
-
text: $('#north').text(),
-
fitWidth: true
-
},{
-
jxtype: 'columncontainer',
-
fitHeight: true,
-
items: [{
-
text: $('#east').text(),
-
width: 150,
-
css: {backgroundColor: '#cccccc', padding: '20px'},
-
fitHeight: true
-
},{
-
text: $('#center').text(),
-
fitWidth: true,
-
css: {backgroundColor: '#eeeeee', padding: '20px', overflow: 'hidden'},
-
fitHeight: true
-
},{
-
text: $('#west').text(),
-
width: 150,
-
css: {backgroundColor: '#cccccc', padding: '20px'},
-
fitHeight: true
-
}]
-
},{
-
height: 50,
-
css: {backgroundColor: '#aaaaaa', padding: '20px'},
-
text: $('#south').text(),
-
fitWidth: true
-
}]
-
});
-
});
-
真的是一个对象吧?而且,用过ExtJS的朋友肯定会发现这段代码很有Ext的风格,而且用法跟ExtJS的布局管理器用法也相近。相信JX的作者也是大受ExtJS的影响吧。
JX出来后,国外的网友提到了很多问题,如果网页使用该布局管理器的话,对JavaScript的依赖性太强,以致禁用JavaScript或出现小bug就足以让网页完全变形。而且需要这样布局的就只有Web App了。
大家又有些什么看法呢?
分享到:
相关推荐
2. **定义指令**:在模板中使用Jxls的指令,如`jx:each`、`jx:sortCol`、`jx:sortRow`等,来指示数据的处理方式。 3. **编写Java代码**:在Java代码中,加载模板,设置数据源,然后使用Jxls API将数据填充到模板中...
demo包含全部官方例子和模版, 2.6官方新增合并单元格标签,jx:mergecells 以及其他相关一切demo,很好的资源,分享给大家,供大家学习交流。 环境依赖 maven JDK1.8 不管使用eclipse 或者idea 直接导入即可,项目中...
你可以创建一个Excel模板,使用特殊的指令(如`jx:`)来指定数据填充的位置和方式。例如,`jx:each`指令可以用来遍历集合数据并填充到指定的行或单元格。 ### **3. 数据绑定** jXLS允许你在模板中使用Java表达式...
对jxl简单的描述,介绍了《jx:forEach》标签的使用
占位符是使用特定的jxls标签定义的,例如`<jx:each>`用于遍历集合,`<jx:eval>`用于执行表达式。模板设计的目标是使Excel的格式和布局与业务逻辑分离。 4. **使用jxls步骤**: - **创建模板**:首先,创建一个...
占位符使用特定的jxls指令,如`<jx:each>`,用于迭代数据集合。 3. **处理数据** 在Java代码中,你需要创建一个数据模型,这通常是一个Java集合,比如List或Map。然后,使用jxls的`JxlsHelper`类来处理模板和数据...
2. **jxls语法**:jxls提供了自己的标签集,如`<jx:each>`、`<jx:if>`等,这些标签可以方便地在Excel模板中进行数据迭代、条件判断和公式计算。例如,`<jx:each items="${list}" var="item">`会遍历传入的数据集合,...
1. **jQuery**:jQuery是一个流行的JavaScript库,简化了HTML文档遍历、事件处理、动画和Ajax交互。它通过简洁的API使得JavaScript编程更加简单,大大提高了开发效率。 2. **Portlet**:Portlet是Web应用程序的一种...
x免费解析二进制文件发布原始码至根目录或二级目录即可。解析调用: //域名/?url =视频播放地址; //域名/二级目录/?...示例: ://qsrjx.cn/jx/ url ://www.mgtv.com/b/329503/10327341.html cxid 90f0zbamf57
JX3BOX用户界面手动更新cdn https://oss.jx3box.com/static/通用UI组件Step.1安装npm install @jx3box/jx3box-common-ui步骤2汇入基础布局(标准三栏布局,公共头底,侧边栏) import JX3BOX_UI from "@jx3box/jx3...
《JX-G变频器说明书》是专门针对JX-G系列变频器的操作和维护手册,对于理解和使用该系列变频器至关重要。以下将从几个关键方面详细解读变频器及其说明书中的知识点: 1. 变频器的基本结构与工作原理: 变频器通常...
JX-G系列变频器说明书pdf,JX-G系列变频器说明书
【标题】"Actions_JX:京东每日备份"指的是一个针对京东相关数据进行日常备份的项目。这个项目的主要目的是为了保存和备份LXK9301/jd_scripts中的数据,确保即使原始来源不可用,也能恢复重要的信息。 【描述】中...
你需要创建一个Excel模板文件(通常以.xls或.xlsx格式),并在其中使用jxls的特定指令(如`<jx:`开头的标签)来定义动态区域。例如,`<jx:each>`标签可以用来遍历Java集合中的元素,将每个元素填充到对应的工作表行...
jxls提供了一组Java API和一系列的指令(如`jx:each`, `jx:if`, `jx:transform`等),可以在Excel模板上定义数据处理规则,然后在运行时将数据应用到模板上生成最终的Excel文件。 2. **模板设计**: 使用jxls时,...
日志4jx log4js-node extend 这个模块是学习log4js-node-extend模块 只需在现有的 log4js 打印日志中添加几行代码即可使用自定义布局。 您可以自由添加进程,执行文件路径,跟踪功能,行号,列号,内存控制,端口号...
NULL 博文链接:https://zqft123.iteye.com/blog/676418
jxls 提供了一种基于模板的编程模型,允许我们在 Excel 模板中使用 JSP-like 标签(例如 `<jx:each>` 和 `<jx:if>`)来控制数据的迭代和条件判断。这样,当 Java 代码与模板结合时,可以批量处理数据,生成复杂格式...
1. **控制器**:JX-300X控制器作为系统的核心,负责执行控制算法,支持实时数据处理和故障诊断。 2. **I/O模块**:提供各种类型的输入/输出模块,适应不同类型的现场信号,如模拟量、数字量、脉冲量等。 3. **现场...