Question

我正在尝试为每个带有JSON对象的JSON数组创建一个按钮。有2个数组。然后，我想将子按钮附加到数组中每个对象的这2个按钮上（每个按钮有6个）。我已经编写了此代码，该代码在我的脑海中应该可以工作，但是不起作用，它只会产生错误。我将包括我的JS代码。我已经尝试了几天，但时间真的用完了，所以任何建议都很好。

x: array([[5.1, 3.5, 1.4, 0.2],
          [4.9, 3. , 1.4, 0.2],
          [4.7, 3.2, 1.3, 0.2],
          [4.6, 3.1, 1.5, 0.2],
          [5. , 3.6, 1.4, 0.2],
          [5.4, 3.9, 1.7, 0.4],
          [4.6, 3.4, 1.4, 0.3],
          [5. , 3.4, 1.5, 0.2],
          [4.4, 2.9, 1.4, 0.2]])

x[:,:] would mean u want every row and every column.

x[3,3] would mean u want the 3 row and the 3 column value

x[:3,:3] would mean u want the rows and columns until 3

x[:, 3] would mean u want the 3 column and every row

// JSON：

<body>
<div id="title"> <!--print how many modules altogether here with .length-->
</div>
<div id="nav">
</div>


<script>
    $( document ).ready(function() { 
        $.getJSON( "courses.json", function( json ) {
            for (var i in Object.keys(json)) {
                var btn = document.createElement("BUTTON");
                document.getElementById("nav").appendChild(btn);
                btn.id = "myBtn";
                    $.each(i, (function(j) {
                        var btns = document.createElement("BUTTON");
                        document.getElementById("myBtn").appendChild(btns);
                        }))
                    }
            })
    })

</script>
</body>

Answer 1

for (var i in Object.keys(json))

对i中的每个Object.keys(json)进行迭代，这将返回对象中键的数组（作为字符串）。 $.each需要一个数组或对象，但是您将其传递给索引i，该索引是一个字符串（如“ semester1”）。

因此，您有两个选择：像这样将json[i]传递给$.each而不是仅仅传递i：

...
    $( document ).ready(function() { 
        $.getJSON( "courses.json", function( json ) {
            for (var key in Object.keys(json)) {
                var btn = document.createElement("BUTTON");
                document.getElementById("nav").appendChild(btn);
                btn.id = "myBtn";
                $.each(json[key], function(index, course) {
                    var btns = document.createElement("BUTTON");
                    document.getElementById("myBtn").appendChild(btns);
                })
            }
        })
    })
...

或者您更改第一个for循环，以使其遍历课程本身以及键“ i”。您可以使用$.each来执行此操作，就像在程序的另一部分一样：

...
    $( document ).ready(function() { 
        $.getJSON( "courses.json", function( json ) {
            $.each(json, function(key, semester_courses) {
                var btn = document.createElement("BUTTON");
                document.getElementById("nav").appendChild(btn);
                btn.id = "myBtn";
                $.each(semester_courses, function(index, course) {
                    var btns = document.createElement("BUTTON");
                    document.getElementById("myBtn").appendChild(btns);
                })
            })
         })
    })
...

我认为这将帮助您解决问题。如果您仍然遇到错误，请发表评论，我将更新我的答案。另外，请使用产生错误的最新代码更新您的问题。谢谢！

Answer 2

假设semester1等是您在主要JSON对象中获得的唯一属性：

$(function(){ // load
$.getJSON('courses.json', function(json){
  $.each(json, function(semester, array){
    $.each(array, function(index, obj){
      var b = document.createElement('input'); // not a submit button - I just prefer this style
      b.type = 'button'; b.id = semester+'_'+index; $('#myButton').append(b);
      $(b).on('click', function(){
        console.log(obj); // should be the Object
      });
    });
  });
});
}); // end load

为JSON对象中的每个数组向div添加一个（子）按钮元素，并为数组中的每个对象添加（至数组按钮的）子按钮

2 个答案: