本帖最后由 小逸老师 于 2025-4-21 17:44 编辑
EHT易网页JS编程,采用Layui作为页面引擎。
新手作品,弄的不好勿喷
开源项目地址:https://gitee.com/xiaoyilaoshi/eht
感兴趣的朋友欢迎一起维护
暂时封装了几个常用组件,不考虑极致性能的话用EHT可以快速创建网页页面。
使用方式:
1、新建一个html文件
2、在head区域加载<script src="lib/eht.js"></script>和<link rel="stylesheet" href="lib/layui/css/layui.css">
3、body区域底部的script块中开始使用EHT的语法进行编写代码
4、需要注意的是如果需要网页载入就创建组件的话需要在script块中的window.onload = function(){你创建组件的代码}监听里写创建组件的代码
5、使用每个组件提供的函数进行组件的创建、修改、删除即可
6、在script块中增加eht_callback(typa,id, stat, title, tag, x, y, key,r,c) 函数作为通用事件回调函数,函数名称固定这个
7、在script块中增加自定义回调函数(typa,id, stat, title, tag, x, y, key,r,c) 函数作为自定义组件回调函数,函数名称随意,可以N个
回调参数说明:
typa=组件类型字符串,id=组件id,stat=事件类型,title=组件标题,tag=组件标签,x=鼠标x坐标,y=鼠标y坐标,key=键盘按键值,r=有多行的组件的行索引,c=有多列的组件的列索引,
stat=1鼠标左键点击,stat=2鼠标右键点击,stat=3键盘按键按下,stat=4键盘按键松开,stat=5鼠标进入,stat=6鼠标移出,stat=7鼠标双击
例如创建一个按钮的代码:
add_button(左边,顶边,宽度,高度,按钮标题,false,标记,'附加CSS如果没有就留空字符',自定义回调函数,'父容器ID如果没有就留空字符');
这样就创建了一个按钮,下载附件:
EHT.zip
(880.25 KB, 下载次数: 16)
文件名称 | 组件名称 | button.js | 按钮组件 | datetime.js | 日期时间框 | div.js | 容器 | tdiv.js | 带标题的容器 | pg.js | 进度条 | pic.js | 图片框 | picplay.js | 轮播图片框 | slider.js | hk条 | table.js | 高级列表框 | text.js | 文字 标签组件 |
优点:
1、每个组件可以单独绑定回调函数和统一回调函数
2、部分组件可以附加css样式,详情请参考组件js的add_*函数
3、可以根据当前已经有的组件参考进行自定义组件开发
4、回调函数里可以自由编写代码进行业务处理,js代码和易语言的比较像哦,所以EHT学习很简单
缺点:
1、由于是通过JS动态创建和控制组件,所以创建-显示组件过程效率会有影响,不过现代电脑一般没问题。
2、由于技术原因可能部分组件的参数没调整好或者有警告,但是暂时不影响使用
3、因为EHT使用了页面元素的id,所以嵌入到易语言里面运行的话请使用其他方式绑定JS
后续将开源易语言编写的可视化布局设计器。
|