0

我正在使用 jQuery。我需要在这里动态显示图像 我有图像 url 我从 db 获取它 我已经在我的解决方案资源管理器中放置了一个文件夹 Bundleimages 我将 url 保存在 db 中我正在获取的 url 并且我正在作为项目。ImageUrl 使用字符串生成器它正在显示图像 url 但需要显示图像

<script type="text/javascript">
    $(document).ready(function () {
        var url = "http://localhost:1711/api/ProductGet/GetProduct";
        $.getJSON(url, function (data) {
            var jsd = JSON.stringify(data);
            var data1 = '{"Items":' + jsd + '}';
            var k = jQuery.parseJSON(data1);
            alert(data);
            $.each(k.Items, function (i, item) {
                var stringbuilder = [];
                stringbuilder.push(' <div ><span class="span1"><img src="' + item.ImageURL + '" name="productimage"></span><span class="span2">' + item.ProductName + '</span><p>' + item.MaximumPrice + '</p></div>');
                $('#BundleDetails').append(stringbuilder.join(''));
            });
         });
</script>

<div class="span7" style="border: 1px black" id="BundleDetails">

</div>

在这里它显示 url 但我需要显示图像任何帮助表示赞赏

<img src="' + item.ImageURL + '" name="productimage">
4

1 回答 1

0

你的代码对我有用。
我猜你的网址不正确。
您正在使用 MVC,您是否正确映射了 URL?

这对我有用::

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title>DynamicImages</title>
    @Html.jQuery()

    <script type="text/javascript">
        $(document).ready(function () 
        {

            var url = "@Url.Action("GetImageList", "Home")";
            $.getJSON(url, function (data) {
                var jsd = JSON.stringify(data);
                var data1 = '{"Items":' + jsd + '}';
                var k = jQuery.parseJSON(data1);
                alert(data);

                $.each(k.Items, function (i, item) 
                {
                    var stringbuilder = [];
                    stringbuilder.push(' <div ><span class="span1"><img src="' + item.ImageURL + '" name="productimage"></span><span class="span2">' + item.ProductName + '</span><p>' + item.MaximumPrice + '</p></div>');
                    $('#BundleDetails').append(stringbuilder.join(''));
                });

            }); // End getJSON

        }); // End document.ready
    </script>
</head>
<body>
    <!--
    <div class="span7" style="border: 1px black" id="separat">
        <ul class="thumbnails bootstrap-examples pre-scrollable" id="productbundles">
        </ul>
    </div>
    -->

    <div id="BundleDetails">


    </div>
</body>
</html>

这是我的控制器:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;

    namespace TestApp.Controllers
    {


        public class HomeController : Controller
        {

        public class ImageToDisplay
        {
            public string ImageURL;
            public string ProductName;
            public string MaximumPrice;
        }


        public JsonResult GetImageList()
        {
            List<ImageToDisplay> ls = new List<ImageToDisplay>();

            ls.Add(new ImageToDisplay { ImageURL = Url.Content("~/Content/images/editor.jpg"), ProductName = "Test1", MaximumPrice = "lol" });
            ls.Add(new ImageToDisplay { ImageURL = Url.Content("~/Content/images/google_plus_one_coin.png"), ProductName = "Test2", MaximumPrice = "lol" });

            return Json(ls, JsonRequestBehavior.AllowGet);
        } // End Action GetImageList



        public ActionResult DynamicImages()
        {
            return View();
        } // End Action About


        public ActionResult About()
        {
            return View();
        } // End Action About


    } // End Class HomeController : Controller


} // End Namespace IssueTracker.Controllers

证明: 证明

于 2012-11-30T12:15:26.890 回答