如何從ajax呼叫自動創建復選框（當前未定義）

嗨，我需要一些幫助來自動為我的 ajax 名稱創建一個復選框，我該怎么做？我已將新答案添加到我的代碼中，但是目前我顯示 Undefinted 帶有我意識到的型別的復選框

<div id="modal">
<section>
<div id="recyclable_id"></div>
</section>
</div>

選項的 Ajax 呼叫示例

     $(document).ready(function() {
                    $.ajax( {
                        url: 'https://ecoexchange.dscloud.me:8090/api/get', 
                        type: 'GET', 
                        dataType: 'json',
                        headers:{
                            query: "RecyclableTypeGet()",
                            // Gets the apikey from the sessionStorage
                            apikey: sessionStorage.getItem("apikey")
                        },
                        success: function(data) {
                        console.log(data);
                        var html='';
                        $.each(data, function(key, value) {
                            html  ='<input type="checkbox" name="recyclable_id[]" value="' value.RecyclableID '"><label style="padding-left: 10px;">' value.Name '</label><br>';
                        }
                        );
                        $('#recyclable_id').html(html);
                        }
                    }
                    );
                    }

                    );

這是我將僅用于名稱的 json 回應

[
    {
        "RecyclableID": 1,
        "Name": "recyclable",
        "RecyclableType": "test recyclable type"
    },
    {
        "RecyclableID": 3,
        "Name": "test recyclable 2",
        "RecyclableType": "WASTE"
    },
    {
        "RecyclableID": 129,
        "Name": "test recyclable 4",
        "RecyclableType": "test recyclable type"
    },
    {
        "RecyclableID": 131,
        "Name": "test recyclable 6",
        "RecyclableType": "test recyclable type"
    },
    {
        "RecyclableID": 132,
        "Name": "test recyclable 7",
        "RecyclableType": "test recyclable type"
    },
    {
        "RecyclableID": 133,
        "Name": "test recyclable 8",
        "RecyclableType": "test recyclable type"
    },
    {
        "RecyclableID": 134,
        "Name": "test recyclable 34",
        "RecyclableType": "WASTE"
    },
    {
        "RecyclableID": 138,
        "Name": "recyclable thing",
        "RecyclableType": "WASTE"
    },
    {
        "RecyclableID": 139,
        "Name": "recyclable thing 2",
        "RecyclableType": "Ewaste"
    },
    {
        "RecyclableID": 153,
        "Name": "test recyclable 10",
        "RecyclableType": "Other"
    },
    {
        "RecyclableID": 154,
        "Name": "test recyclable 11",
        "RecyclableType": "Ewaste"
    },
    {
        "RecyclableID": 155,
        "Name": "test recyclable 123",
        "RecyclableType": "test recyclable type 2"
    },
    {
        "RecyclableID": 159,
        "Name": "some recyclable name",
        "RecyclableType": "CC"
    },
    {
        "RecyclableID": 161,
        "Name": "some recyclable name 2",
        "RecyclableType": "Ewaste"
    },
    {
        "RecyclableID": 162,
        "Name": "recyclable 2",
        "RecyclableType": "test recyclable type 2"
    },
    {
        "RecyclableID": 165,
        "Name": "test recyclable 15",
        "RecyclableType": "WASTE"
    },
    {
        "RecyclableID": 166,
        "Name": "test recyclable 18",
        "RecyclableType": "testing type"
    },
    {
        "RecyclableID": 167,
        "Name": "some recyclable name 23",
        "RecyclableType": "Ewaster"
    }
]

這是我的圖片顯示 undefined 我試圖用給定的新分析儀進行更改，但它似乎從型別中獲得了 undefined x 10

uj5u.com熱心網友回復：

這行得通嗎？Copilot 創建了代碼 xD

$(document).ready(function() {
  $.ajax( {
    url: 'http://localhost/recyclable/public/api/recyclable', type: 'GET', dataType: 'json', success: function(data) {
      console.log(data);
      var html='';
      $.each(data, function(key, value) {
        html  ='<input type="checkbox" name="recyclable_id[]" value="' value.RecyclableID '"><label style="padding-left: 10px;">' value.Name '</label><br>';
      }
      );
      $('#recyclable_id').html(html);
    }
  }
  );
}

);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="recyclable_id"></div>

標籤：javascript html 阿贾克斯

上一篇：如何更新Tkinter標簽？

下一篇：獲取請求后無法更新狀態