时间戳

首页 > 解决方案 > 在 JQuery 或 JavaScript 中将对象转换为 HTML 输入

javascript - 在 JQuery 或 JavaScript 中将对象转换为 HTML 输入

问题描述

我有一个对象如下。有没有办法在 jQuery 或 JavaScript 中分别将其转换为 HTML 输入？

目的：

{
  "OrderID": 110,
  "TKOrderStatus": 61,
  "Description": "Order Updated",
  "IsActive": true,
  "IsDeleted": false,
  "IPAddress": "::1",
  "CreatedAt": "\/Date(1568972577698)\/",
  "ID": 0
}

预期的 HTML 输出：

<input type="text" name="OrderID" value="110" />
<input type="text" name="TKOrderStatus" value="61" />
<input type="text" name="Description" value="Order Updated" />
<input type="text" name="IsActive" value="true" />
<input type="text" name="IsDeleted" value="false" />
<input type="text" name="IPAddress" value="::1" />
<input type="text" name="CreatedAt" value="\/Date(1568972577698)\/" />
<input type="text" name="ID" value="0" />

标签： javascriptjqueryhtml

解决方案

用于append附加值并Object.keys从对象中获取键和对应的值

var a={
  "OrderID": 110,
  "TKOrderStatus": 61,
  "Description": "Order Updated",
  "IsActive": true,
  "IsDeleted": false,
  "IPAddress": "::1",
  "CreatedAt": "\/Date(1568972577698)\/",
  "ID": 0
};
Object.keys(a).forEach(function(e){
$('#q').append('<input type="text" name='+e+' value='+a[e]+'>')
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="q"></div>

推荐阅读