使用javascript提交之前自动预览表单内容

Question

我打算设计一个用于收集用户通信详细信息的表单。这些通常包括地址，姓名，电话号码等。

我的要求是在表单下方创建一个打印机标签大小的框，以自动开始显示地址在打印标签上的外观。

有没有使用bootstrap JavaScript执行此操作的指针？

Answer 1

看一下Mutation Observer API：

here

and here

它允许您跟踪DOM中的更改并调用回调函数。我最近使用它制作了一个可编辑的HTML表格，它非常直观。您可以观察属性更改，DOM树更改等。因此，我建议构建一个“模板”，它将容纳您的变量（地址，名称等），使用Bootstrap设置样式并使用Mutation Observer API填写它觉得合适。

---

您还可以使用好的旧事件侦听器并将表单中的用户输入克隆到下面的模板，即使用“onkeypress”事件。只要输入了某些内容，它就会显示在模板上。