UD5工具箱
表单相关术语
HTML表单（HTML Form）
HTML表单是网页中用于收集用户输入数据的一组界面元素。表单通过form标签定义，内部包含各种输入控件（如文本框、选择框、按钮等）。当用户填写完毕并提交时，表单会将收集到的数据按照指定的方式（GET或POST）发送到服务器进行处理。HTML表单是Web应用中最基础的数据交互机制，广泛用于登录注册、信息采集、搜索查询等场景。
表单控件（Form Control）
表单控件是表单中用于接收用户输入的各种HTML元素，也称为表单组件。常见的表单控件包括input（文本输入框）、select（下拉选择框）、textarea（多行文本域）、button（按钮）等。每种控件都有特定的type属性值和对应的功能，例如type="text"表示文本输入框，type="email"表示邮箱输入框，type="checkbox"表示复选框。在表单代码生成器中，13种可用组件都属于表单控件的范畴。
label标签
label标签是HTML中用于为表单控件定义文字标签的元素。它通过for属性与input元素的id属性建立关联，实现点击label文字即可聚焦到对应输入框的交互效果。更重要的是，label标签是Web无障碍的重要组成部分——屏幕阅读器会自动朗读与input关联的label内容，帮助视障用户理解每个输入框的用途。在表单代码生成器中，每个表单控件都会自动生成关联的label标签。
fieldset和legend
fieldset是HTML中用于将一组相关表单控件包裹在一起的语义化容器标签，legend则是为这个容器提供标题说明的标签。这对标签组合在单选按钮组和复选框组中尤为重要，它向浏览器和辅助技术表明这些控件属于同一组。例如，一组性别单选按钮可以用fieldset包裹，legend标注为「性别」，屏幕阅读器在用户聚焦到其中一个单选按钮时会先朗读「性别」，再朗读具体的选项文字。
placeholder属性
placeholder是input和textarea元素的一个属性，用于在输入框为空时显示提示性文字。当用户开始输入时，placeholder文字会自动消失。它通常用来提示用户应该输入什么类型的信息，例如「请输入您的邮箱地址」。需要注意的是，placeholder文字的颜色较浅且不具备label的语义功能，不能完全替代label标签。在表单代码生成器中，placeholder是可选配置项。
name属性
name属性是表单控件的关键属性之一，它定义了表单提交时该控件数据的字段名。当表单被提交时，浏览器会将每个控件的name值和用户输入的值组装成键值对发送给服务器。例如，一个name="email"的输入框，用户输入"test@example.com"后提交，服务器会收到email=test@example.com这样的数据。name属性的命名应当清晰有意义，便于后端代码解析和处理。
required属性
required是HTML5引入的布尔属性，添加到表单控件上表示该字段为必填项。当用户尝试提交表单时，浏览器会自动检查所有带有required属性的控件是否已填写，未填写的控件会显示错误提示并阻止表单提交。这是浏览器内置的客户端验证机制，无需编写JavaScript代码即可实现基础的表单校验。在表单代码生成器中，每个组件都支持「必填」选项的配置。
前端框架与技术术语
Bootstrap 5
Bootstrap是全球最流行的前端UI框架之一，由Twitter团队开发并开源。Bootstrap 5是其最新的主要版本，提供了丰富的CSS类和JavaScript插件，用于快速构建响应式、移动优先的Web界面。在表单领域，Bootstrap 5提供了一系列专门的样式类：form-control用于文本输入框和文本域，form-label用于标签，form-select用于下拉选择框，form-check和form-check-input用于复选框和单选按钮等。表单代码生成器默认为所有生成的表单元素应用Bootstrap 5的类名。
响应式设计（Responsive Design）
响应式设计是一种Web设计方法，使网页能够在不同尺寸的设备上自动调整布局和样式，以提供最佳的浏览体验。在表单场景中，响应式设计意味着表单在桌面电脑上可能显示为多列布局，而在手机上会自动调整为单列堆叠布局。Bootstrap 5的栅格系统和响应式工具类是实现响应式设计的常用手段。表单代码生成器生成的代码由于使用了Bootstrap的类名，天然具备响应式特性。
HTML5 Input Types
HTML5为input元素引入了多种新的type属性值，包括email、number、date、url、tel、search等。这些新的输入类型不仅改善了数据验证（浏览器会自动进行格式校验），还改善了移动端的输入体验（不同类型会触发不同的虚拟键盘布局）。例如，type="email"会在移动设备上显示带有@符号的键盘，type="number"会显示数字键盘。表单代码生成器利用了这些HTML5新特性来提供更好的用户体验。
无障碍（Accessibility / a11y）
Web无障碍是指确保网站和Web应用能够被所有人使用，包括有视觉、听觉、运动或认知障碍的用户。在表单领域，无障碍的关键要素包括：为每个输入控件提供关联的label标签、使用fieldset和legend对控件进行语义化分组、确保键盘可以完整操作所有控件、提供清晰的错误提示等。表单代码生成器在生成代码时会自动包含label关联和fieldset分组，确保生成的表单具有基本的无障碍支持。
Drag and Drop API
HTML5 Drag and Drop API是浏览器原生提供的拖拽交互接口，允许开发者实现元素的拖拽操作而无需借助第三方库。该API定义了拖拽源（draggable属性）、放置目标以及拖拽过程中的一系列事件（dragstart、drag、dragenter、dragover、drop、dragend）。表单代码生成器利用Drag and Drop API实现了组件从库面板到画布的拖拽交互，同时针对移动端触屏环境进行了事件适配。
撤销/重做（Undo/Redo）
撤销和重做是软件中常见的操作管理机制。撤销（Undo）将应用程序的状态回退到上一次操作之前的状态，重做（Redo）则重新执行被撤销的操作。在实现上，通常使用命令模式（Command Pattern）或状态栈来管理操作历史。表单代码生成器采用操作历史栈的方式，保留最近50步的操作记录，支持通过Ctrl+Z快捷键触发撤销操作，方便用户在构建表单时进行反复调整。