javascript - 如何在 div 中列出图像

Question

我的问题是：我想从它的目录中提取图像，与它们的数量无关，并通过 ul/li 将其列在一个 div 中。我在 HomeController 中有这段代码：

public ActionResult ContactUs()
{
    return View();
}

public ActionResult ListImagesProducts()
{

        DirectoryInfo diretorio = new DirectoryInfo(@"~\Content\images\Products\");

        FileInfo[] Arquivos = diretorio.GetFiles("*.*");


        List<string> model = new List<string>();

        foreach (FileInfo fileinfo in Arquivos)
        {
            model.Add(fileinfo.Name);
        }

        var diretory = model;

        return Json(diretory, JsonRequestBehavior.AllowGet);
}

在 ContactUs 视图中，我有以下代码：

@{
    ViewBag.Title = "Three Jay - Produtos";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
<script type="text/javascript">
     $(getImages);
     function getImages() {
         $.getJSON("Home/ListImagesProducts", showImages);
     }

     function showImages(data) {
         for (i = 0; i < data.length; i++) {
             var images = data[i];
             $("#diretoryImages").append("<li>" + images.toString + "</li>");
         }
     }

</script>
<div id = "diretoryImages" />

我究竟做错了什么？你们能帮帮我吗？

Answer 1

在不知道您的实际问题是什么或过度分析您的代码的情况下，您是否尝试将图像标签添加到图像文件名？

例如

function showImages(data) {
         for (i = 0; i < data.length; i++) {
             var images = data[i];
             $("#diretoryImages").append("<li><img src='" + images.toString + "' /></li>");
         }
     }