在线演示地址:
( 在线演示 云平台 由 Kooboo 提供 )
按钮:
下拉:
下拉框:
PictureBox:
动态创建添加控件:
下拉菜单:
文本编辑器:
文本编辑器(自适应窗口大小):
可拖拽对象:
可拖拽对话框:
可拖拽 PictureBox:
多窗口 MDI 模块化:
复杂界面 通常 用 模块化 的 方式开发 。
PictureBoxFit (适应图片自身比例的 PictureBox):
DragPictureBoxFit (可拖拽 PictureBoxFit):
ContextMenu (右键菜单):
jWebForm 的 实际应用 还可参考 《我发起并创立了一个 EPWA 的 开源项目》 。
我发起并创立了一个 Javascript 前端库 开源项目 jWebForm 。
起因是我前几天写了一篇文章《.Net Core 没有 WebForm 是 历史 的 退步》
,
然后有网友说, 现在都是 前端渲染 了,
然后想了一下, 觉得可以把 2 者 想法 结合 起来, 写一个 可以用 WebForm 控件 方式 在 Html 里 写控件 的 前端库, 这就是 jWebForm 。
项目地址 :
目前支持 按钮(Button), 下拉框(DropDownList), PictureBox(可以播放图片), 下拉菜单(DropMenu) 4 种 控件,
以及 动态 创建 控件 并 添加 到 Html Dom 中 。
项目里的文件如下 :
jWebForm.js, jWebForm.css 是 jWebForm 的 库文件, 引用 这 2 个 文件 就可以使用 jWebForm 。
Button.htm 是 按钮 的 示例, DropDownList.htm 是 下拉框 示例, PictureBox.htm 是 PictureBox 的 示例, DynamicCreateControl.htm 是 动态创建控件并添加到 Html Dom 的 示例 。
我们来看看代码 :
按钮 :
……
下拉框 :
……
看图中的 Page_Load, 和 WebForm 的 Page_Load 一样 。
PictureBox :
……
动态创建控件 并 添加到 Html Dom :
通过 Element() 属性(函数)返回 Control 最外层 的 Element,添加到 Html Dom 就可以了 。
下拉菜单(DropMenu) 是 后来新增的, 看 DropMenu.htm 示例 就可以 。
jWebForm 不打算提供 表格控件(比如像 Asp.net WebForm 里的 GridView 那样), 开发人员 可以自己写一个 Util 类 来 实现类似 GridView 的 数据绑定为表格 的 功能, 可以用 jWebForm 提供的 动态创建控件 的 方式 动态创建 jWebForm Control 并添加到 Html Dom 里, 这种方式 是 简单 直观 自由 透明 的 。
Html 的 <table /> 元素(table 对象) 是一个 简单 直观 易用 的 表格对象, 开发人员 自己写一个 Util 类 来 绑定数据 生成 table 对象 就可以 。
jWebForm 也不打算提供 布局控件, 开发人员 自己 用 Html + Css + Js 来 布局 是 简单 直观 自由 透明 的 。
jWebForm 的 特点 就是 几乎没有什么侵入性 。 可以和 Html + Css + Js 混合使用 。
这就是 “库”(Lib) 的 观念, 按需取用库, 即插即用, 即拔即无 。 而不像框架, 动不动先整个框架给你套起来 。
我之前还写过一个 Js 库 jlet , 也可以看看 : 。