从对象数组创建选项元素答案

【问题标题】：Create option elements from array of objects从对象数组创建选项元素
【发布时间】：2019-02-21 12:09:50
【问题描述】：

我想过滤subject 中的值，并使用Javascript 在HTML 中的option 标记中显示它们。我该怎么做？

var user = [{
  "id": 1,
  "firstname": "kalpit",
  "lastname": "dwivedi",
  "age": 20,
  "hometown": "jhansi",
  "job": "web design",
  "subject": ["Hindi", "English"]
}, {
  "id": 2,
  "firstname": "golu",
  "lastname": "gupta",
  "age": 30,
  "hometown": "Vadodara",
  "job": "qa tester",
  "subject": ["Hindi", "Socilogy"]
}, {
  "id": 3,
  "firstname": "john",
  "lastname": "doe",
  "age": 35,
  "hometown": "newport",
  "job": "oprater",
  "subject": ["English", "Socilogy"]
}, {
  "id": 4,
  "firstname": "mohit",
  "lastname": "khare",
  "age": 40,
  "hometown": "kochi",
  "job": "civil",
  "subject": ["infa", "angularjs"]
}

【问题讨论】：

嗨，欢迎来到 stackoverflow！请将您的相关代码作为minimal reproducible example 添加到您的问题中。然后按您的意图解释在您的实施中什么不起作用。

标签： javascript jquery html

【解决方案1】：

这是一个包含您的一些数据的示例...如果您想要动态，您必须使用 jquery 执行 $.each..

如果这是你想要的，请告诉我。

var data = '{"id":2, "firstname":"golu", "lastname":"gupta", "age":30, "hometown":"Vadodara", "job":"qa tester", "subject" : ["Hindi", "Socilogy"]}';

    var dataParse = JSON.parse(data);
    console.log(dataParse.subject);
    $(document).ready(function(){

        $('#opt1').html(dataParse.subject[0]);
        $('#opt2').html(dataParse.subject[1]);
    });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <select name="data" id="data">
        <option value="" id="opt1"></option>
        <option value="" id="opt2"></option>
 </select>

【讨论】：