在线演示地址:

( 在线演示 云平台 由 Kooboo 提供  https://www.kooboo.com/ )

按钮:      http://iwebform.kgeking.kooboo.site/jWebForm-master/Button.htm

下拉:      http://iwebform.kgeking.kooboo.site/jWebForm-master/DropDown.htm

下拉框:    http://iwebform.kgeking.kooboo.site/jWebForm-master/DropDownList.htm

PictureBox:       http://iwebform.kgeking.kooboo.site/jWebForm-master/PictureBox.htm

动态创建添加控件:   http://iwebform.kgeking.kooboo.site/jWebForm-master/DynamicCreateControl.htm

下拉菜单:          http://iwebform.kgeking.kooboo.site/jWebForm-master/DropMenu.htm

文本编辑器:       http://iwebform.kgeking.kooboo.site/jWebForm-master/EditArea.htm

文本编辑器(自适应窗口大小):  http://iwebform.kgeking.kooboo.site/jWebForm-master/EditArea_Fit_Window.htm

可拖拽对象:       http://iwebform.kgeking.kooboo.site/jWebForm-master/DragObj.htm

可拖拽对话框:       http://iwebform.kgeking.kooboo.site/jWebForm-master/DragDialog.htm

可拖拽 PictureBox:       http://iwebform.kgeking.kooboo.site/jWebForm-master/DragPictureBox.htm

多窗口 MDI 模块化:      http://iwebform.kgeking.kooboo.site/jWebForm-master/MultiWindow_MDI_Modulize/Main.html

复杂界面 通常 用 模块化 的 方式开发 。

PictureBoxFit (适应图片自身比例的 PictureBox):   http://iwebform.kgeking.kooboo.site/jWebForm-master/PictureBoxFit.htm

DragPictureBoxFit (可拖拽 PictureBoxFit):   http://iwebform.kgeking.kooboo.site/jWebForm-master/DragPictureBoxFit.htm

ContextMenu (右键菜单):          http://iwebform.kgeking.kooboo.site/jWebForm-master/ContextMenu.htm

jWebForm  的 实际应用 还可参考 《我发起并创立了一个 EPWA 的 开源项目》  https://www.cnblogs.com/KSongKing/p/10745935.html  。

我发起并创立了一个 Javascript 前端库 开源项目  jWebForm  。

起因是我前几天写了一篇文章《.Net Core 没有 WebForm 是 历史 的 退步》

https://www.cnblogs.com/KSongKing/p/10293643.html

然后有网友说, 现在都是 前端渲染 了,

然后想了一下, 觉得可以把 2 者 想法 结合 起来,  写一个 可以用 WebForm 控件 方式 在 Html 里 写控件 的 前端库,  这就是  jWebForm  。

项目地址 :

https://github.com/kelin-xycs/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 ,    也可以看看 :     https://www.cnblogs.com/KSongKing/p/9455238.html         。

我发起并创立了一个 Javascript 前端库 开源项目 jWebForm的更多相关文章

  1. 我发起并创立了一个 C 语言编译器 开源项目 InnerC

    本文是 VMBC / D#  项目 的 系列文章, 有关 VMBC / D# ,  见 <我发起并创立了一个 VMBC 的 子项目 D#>(以下简称 <D#>)  https: ...

  2. 我发起并创立了一个 EPWA 的 开源项目

    EPWA ,  是  Easy PWA  的 意思, PWA 取自于 Google 的 PWA, EPWA   是一个用   C#  Cef  Html  js  css   开发 桌面程序 的 架构 ...

  3. 我发起并创立了一个 VMBC 的 子项目 D#

    大家好, 我发起并创立了一个 VMBC 的 子项目 D#  . 有关 VMBC ,  请参考 <我发起了一个 用 C 语言 作为 中间语言 的 编译器 项目 VMBC>     https ...

  4. 准备开一个地图SDK的开源项目

    最近有点空闲时间了, 准备开一个地图SDK的开源项目, 现在的地图SDK已经有很多了, 再做一个跟重新发明个轮子差不多, 但还想做的原因是想在别的轮子的基础上造个轮子... 初步设想是基于开源的地图渲 ...

  5. 一个P2P点播直播开源项目:P2PCenter

    最近跟着公司的项目走,我也研究了不少东西,尤其是在P2P方面,广泛涉猎各种开源项目,尤其是国外的开源项目,意外的发现了一个国内的项目,做的还不错,推荐一下.---------------------使 ...

  6. 一个可能是世界上最全的 API 接口集合库开源项目

    对于程序员来说,为自己的程序选择一些合适的API并不是那么简单,有时候还会把你搞得够呛,今天猿妹要和大家分享一个开源项目,这个项目汇集了各种开发的api,涵盖了音乐.新闻.书籍.日历等,无论你是从事W ...

  7. 一个基于 Vue3 的开源项目,3个月时间 star 终于破千!

    本文主要是对如何做开源项目的一些思考. 前文回顾: <Vue3 来了,Vue3 开源商城项目重构计划正式启动!> <一个基于 Vue 3 + Vant 3 的开源商城项目> 关 ...

  8. 我发起并创立了一个 .Net 平台上的 Web 业务系统 基础库 开源项目 WebEasy

    我 强调一点, 程序员 应该对 程序 有 控制感 . 过多的 控制反转 使 程序员 丧失了 对 程序 的 控制感 . 过多的 依赖注入 束缚了 程序员 的 创造力 . 过度复杂的 架构设计 束缚了 程 ...

  9. 实现一个javascript手势库 -- base-gesture.js

    现在移动端这么普及呢,我们在手机上可以操作更多了.对于网页来说实现一些丰富的操作感觉也是非常有必要的,对吧(如果你仅仅需要click,,那就当我没说咯...)~~比如实现上下,左右滑动,点击之类的,加 ...

随机推荐

  1. CSS3简单画出3d图形

    1.气球 2.泳圈 1.2两图实现代码分别如下: <html> <head> <meta charset="utf-8"> <meta h ...

  2. Docker环境下的Mysql8 实现主从数据库数据同步方案

    本文记录下通过MySQL Replication在Docker环境下,通过多个容器 实现数据库主从配置. MySQL Replication就不多解释了,简单说就是MySQL非常出色的一个功能,该功能 ...

  3. OpenGL绘制一个四边形

    学习自:https://learnopengl-cn.github.io/01%20Getting%20started/04%20Hello%20Triangle/ OpenGL没有直接绘制四边形的a ...

  4. FireFox 插件xpi文件签名2

    上一篇https://www.cnblogs.com/nightnine/p/6140676.html 提交到官方网站上的签名,官方已经拒绝了 于是手动自己签名 官方文档:https://develo ...

  5. Springboot添加定时任务

    请参考这篇文章:https://blog.csdn.net/ysp_0607/article/details/71430281

  6. python—函数

    # 函数:1.减少重复代码:# 2.使程序变的可扩展# 3.使程序变的易维护# 永远只能且返回一个值#def 定义内容# a,b = 5,8# c = a** b# print(c)## def ca ...

  7. Java如何按空格读取内容

    String s = input.nextLine(); String[] data = s.split(" ");

  8. JavaScript·aJax

    1.ajax 无刷新数据获取,ajax能且仅能从服务器读取文件 ajax_string ajax_数组 ajax_json ajax_分页 2.ajax原理 ajax请求: 1.创建ajax对象2.连 ...

  9. idea【快捷键】

    ctrl+shift+a:全局搜索 IDEA 的操作和设置 shift+f6:重命名 ctrl+alt+m:提取方法 ctrl+alt+l:格式化代码 ctrl+alt+o:优化导入类和包 ctrl+ ...

  10. 生物信息学工具--bowtie&bowtie2

    Bowtie和Bowtie2使用 [怪毛匠子整理] Source URL: http://www.bbioo.com/lifesciences/40-112837-1.html Bowtie和Bowt ...