Question

我想在一个名为img_list的div中创建一个动态链接列表，当我点击它将通过Ajax调用在相邻的iframe中打开的任何链接时。

所以我做了以下事情：

 <div id="myModal" class="modal">
        <span class="close">&times;</span>
        <div id="img_list">
        </div>
        <iframe id="img_loc" width="300" class="modal-content"
            height="500"
            allowfullscreen data-token="3Az3ki"></iframe>
        <div id="caption"></div>
  </div>

 var imageList = function (projId, locCode) {
            return $.ajax({
                type: "POST",
                url: "SeventhNavi.aspx/ListImages",
                data: JSON.stringify({ projId: projId, locCode: locCode }),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                async: true,
                cache: false
            });

        };

modal.style.display = "block";
            imageList(1, 'G11').done(function (data) {
                var appenddata;
                $.each(data, function (key, value) {
                    appenddata += "<a href = '" + value.loc_path + " '>" + value.description + " </a>";
                });
                $('#img_list').html(appenddata);

            });

我返回的Json对象是这样的：

[{"description":"demo","loc_path":"https://en.wikipedia.org/wiki/Computer#/media/File:DM_IBM_S360.jpg"},{"description":"demo","loc_path":"https://en.wikipedia.org/wiki/Computer#/media/File:Eniac.jpg"},{"description":"demo","loc_path":"https://en.wikipedia.org/wiki/Computer#/media/File:Cray_2_Arts_et_Metiers_dsc03940.jpg"}]

此代码不起作用！

Answer 1

API返回对象数组，需要通过索引

访问它

        modal.style.display = "block";
        imageList(1, 'G11').done(function (data) {
            var appenddata;
            for(var i =0 ; i<data.length; i++){
                appenddata += "<a href = '" + data[i].loc_path + " '>" + data[i].description + " </a>";
            }
            $('#img_list').html(appenddata);

        });

如何通过Ajax调用创建可点击链接的动态列表

1 个答案: