如何使用任何 JSON 对象动态生成 HTML FORM？答案

【问题标题】：how to generate HTML FORM dynamically using any JSON object?如何使用任何 JSON 对象动态生成 HTML FORM？
【发布时间】：2017-12-19 20:18:38
【问题描述】：

如果有人能告诉我如何使用 javascript 基于任何 JSON 对象动态生成 HTML 表单，我将不胜感激？

【问题讨论】：

这个问题太宽泛，无法回答。肯定需要比这更多的信息
我可以知道您还需要什么信息吗？
JSON 的内容是什么？什么进入身体？ JSON 中的哪个值转到哪个标签？这些是开始的问题
内容将是包含数据类型、数据名称和数据本身的多个对象。
这只是解释了任何对象的内容，而不是它应该如何映射到 HTML 内容

标签： javascript html json dynamic

【解决方案1】：

试试这个seee

您可以为此使用现有的库。

一个简单的方法是： Angular Dynamic Forms

更标准的方法是JSON Schema，这个很好的实现Angular Schema Form。在此处查看有关其工作原理的示例DEMO

【讨论】：

【解决方案2】：

HTML：

<html>
 <head></head>
 <body>

 <body>
</html>

javascript：

<script>
//create a form
var f = document.createElement("form");
f.setAttribute('method',"post");
f.setAttribute('action',"submit.php");

//create input element
var i = document.createElement("input");
i.type = "text";
i.name = "user_name";
i.id = "user_name1";

//create a checkbox
var c = document.createElement("input");
c.type = "checkbox";
c.id = "checkbox1";
c.name = "check1";

//create a button
var s = document.createElement("input");
s.type = "submit";
s.value = "Submit";

// add all elements to the form
f.appendChild(i);
f.appendChild(c);
f.appendChild(s);

// add the form inside the body
$("body").append(f);   //using jQuery or
document.getElementsByTagName('body')[0].appendChild(f); //pure javascript

</script>

您可以动态创建任意数量的元素。

【讨论】：

为什么是 php 文件？