我正在构建一个小的网页,该网页将用于通过预定义的设置操作来控制一组RGB led。为了以图形方式配置操作,将使用一个包含开始和结束像素,相关颜色信息以及要使用的设置操作的表单。

(顺便说一句,不提交表单,因此,如果其他结构更好用,则可以改用它。Forms support name,因此至少可以帮助其中的一些。Javascript将表单中的数据解析为JSON文件与AJAX稍后发送的。我已经得到了那大多是想通了,但有一些地方我要去哪里的问题,弹出复杂的事情,试图读出所有形式的数据一次在一个简单方式。)

每个表单都有一些动作(onChange选择该动作的下拉菜单或删除按钮)仅影响该表单(或其一部分)。还应该有一种一次性获取所有表单并提取数据以发送到服务器的方法(name由于THAT数据安全地包含在表单可访问元素中,因此可以很好地工作)。

我也无法使用JQuery之类的帮助程序库,因为无法访问Internet。所有代码都必须托管在服务器上,而且空间极小(托管它的是嵌入式处理器)。我现在不想添加40KB的Jquery。

我遇到的问题是我需要更改标签文本并根据选择的选项显示或隐藏元素。

例如,一种颜色只需要一个颜色输入标签,而线性淡入淡出则需要两个颜色标签。其他人则不需要颜色,因为它们会对现有的颜色模式执行操作。

使用aform可以name通过查找form_as_JS_var.elements.name来访问具有属性集的事物。遗憾的是,这不适用于原始HTML或spans或除特定于表单的元素以外的任何其他内容。我还发现,document.getElementById()除了document(如果到目前为止还不很清楚,我对HTML和JS有点陌生)以外,它没有其他等效项。我一直希望做类似.getElementById(“ color1”)之类的事情(它可能会让我使用相同的标签以简化操作,只要它们不会以每种形式重复使用,但事后看来有点愚蠢)。无论哪种方式,我都需要确保每个添加的表单都包含多个全局唯一的ID,并且 以某种方式 当受影响的物料和触发更改的物料具有相同的形式时,请查找ID!

我确实发现了该label标签,但是它(出于某些无法解释的原因)绑定到ID而不是名称(并且很烦人,无法使用JS进行设置,但这是另一回事了)。因此,我仍然坚持使用从全局访问的全局ID,document而不是从任何形式的本地表单方法访问。

我要使用的HTML表单如下:

New Control Entry

Type:

Rainbow Pattern

Clone Fill

Linear Fade

Single Color

Animation

Color 1:

Color 2:

请注意,其中很多都需要唯一的ID(添加了_#部分)。我必须具有GUID才能使标签正确访问它们(没有ID使得标签不可访问,非唯一ID使它们全部均等地绑定到具有该ID的每个项目(跨表格))。我还必须有一个ID才能更改图例标签的名称(应该更改为与当前选择的Type相匹配。

html实现动态多表单输入,使用javascript动态编辑多个相同的HTML表单相关推荐

  1. 动态给div追加html代码,javascript – 动态添加/删除div到html

    删除: var div = document.getElementById('xyz'); if (div) { div.parentNode.removeChild(div); } 或者如果您不控制 ...

  2. Vue表单输入绑定(元婴中期)

    表单输入绑定 基础用法 你可以用 v-model 指令在表单 <input>.<textarea> 及 <select> 元素上创建双向数据绑定.它会根据控件类型自 ...

  3. 2021年中国单输入K型温度计市场趋势报告、技术动态创新及2027年市场预测

    单输入K型温度计市场的企业竞争态势 该报告涉及的主要国际市场参与者有Extech Instruments.Hioki.Fluke.ATP Instrumentation.Hanna Instrumen ...

  4. svn注册表编辑器怎么打开_如何在Windows 10上打开注册表编辑器

    svn注册表编辑器怎么打开 Windows and a lot of third-party applications store their settings in the registry. Th ...

  5. 网页制作表单代码java_JSP动态网页入门:表单输入例子

    我们将创建一个web页面,它有一个输入表单,用户可以输入一个股票代号以获得出当前股票价格(有20分钟延迟).如果输入有误,则显示错误提示页面. quote.jsp 首先,用以下代码创建quote.js ...

  6. html实现动态多表单输入,提交多个动态添加的html表单

    我正在构建一个可以动态添加表单的功能.不是表单字段,而是一个完整的单独的HTML表单.提交多个动态添加的html表单 我使用JS添加它们. add_email_template $('#add_ema ...

  7. uniapp 输入法画面_表单输入绑定 · uni-app跨平台移动应用开发 · 看云

    # 表单输入绑定 ## [基础用法](https://cn.vuejs.org/v2/guide/forms.html#%E5%9F%BA%E7%A1%80%E7%94%A8%E6%B3%95 &qu ...

  8. html表单通过js提交表单提交,JavaScript动态创建form表单并提交的实现方法

    本文实例讲述了JavaScript动态创建form表单并提交的实现方法.分享给大家供大家参考,具体如下: 页面布局有些复杂的情况下,可能需要在页面中动态创建一个 form,JavaScript 创建 ...

  9. html5 前端动态加载后端,Vue+Element的动态表单,动态表格(后端发送配置,前端动态生成)...

    vue+element的动态表单,动态表格(后端发送配置,前端动态生成) 动态表单生成 elementui官网引导 关键配置 template中,form和form-item的写法和绑定 data里的 ...

最新文章

  1. lr如何监控linux,LoadRunner如何监控Linux系统资源
  2. python栈是什么意思_Python数据结构——栈
  3. 抓住金三银四好机会,超齐全java大厂面试题汇总(请自寻学习查找答案)
  4. build 之前执行task_一次NPM前端项目的CI-Build速度优化
  5. 《概率论与数理统计习题全解指南》中的“计算机得”
  6. 实验四 栈和队列的基本操作
  7. C#刷遍Leetcode面试题系列连载(2): No.38 - 报数
  8. html、sqlserver、java基础总结
  9. 10个前端开发人员必须知道的CSS框架
  10. 核心金融场景分布式事务
  11. 哈夫曼树的生成详解(C++)
  12. mysql binlog 备份_linux定时备份mysql数据库
  13. 南阳理工acm 1007GCD
  14. 手把手教你使用 i2c-tools
  15. 前端实战——实现购物车功能
  16. rtl8821cs wifi驱动调试 imx6
  17. 中级软件工程师的技能基本要求
  18. 虚拟机安装win10 x64系统
  19. 多传感器融合定位 第十章 基于优化的定位方法
  20. //css 层叠样式表(Cascading Style Sheets)

热门文章

  1. Ubuntu16.04 Caffe2 编译安装步骤记录
  2. d3.js 搭建 d3-force-directed-graph 例子
  3. c++导出标准win32格式的dll
  4. html5视差滚动效果,视差滚动效果
  5. 石头剪刀布程序流程图_石头剪刀布!我要与电脑决战到天明!(14天)
  6. python爬虫获取url_Python爬虫如何获取页面内所有URL链接?本文详解
  7. python分治算法_分治法及其python实现例子
  8. python自动化发送邮件_Python发送邮件自动化脚本
  9. php mvc教程 文档,PHP培训教程教你快速打造PHP MVC框架[PHP基础教程]
  10. arm放弃服务器芯片,ARM溃败:Applied Micro拆分ARM架构服务器芯片业务