【问题标题】:Fetching photos dynamically?动态获取照片?
【发布时间】:2013-03-28 08:52:16
【问题描述】:

我正在尝试在 ASP.NET (C#) 中集成 JavaScript 相册。 我使用的代码使用硬编码图像;我想动态获取这些图像。

 <div class="image_stack" style="margin-left:300px">
   <img id="photo1" class="stackphotos" src="photos/4.jpg"  >
   <img  id="photo2" class="stackphotos" src="photos/5.jpg" >
   <img  id="photo3" class="stackphotos"  src="photos/6.jpg" > 
 </div>

我想用从数据库中提取的 3 个 URL 替换这些硬编码的照片。我怎样才能做到这一点?

【问题讨论】:

    标签: c# javascript asp.net sql css


    【解决方案1】:

    一种简单的方法:

    使用 ASP:图像控件

     <asp:Image ID="photo1" class="stackphotos" runat="server" ImageUrl=" " />  
     <asp:Image ID="photo2" class="stackphotos" runat="server" ImageUrl=" " />  
     <asp:Image ID="photo3" class="stackphotos" runat="server" ImageUrl=" " />  
    

    然后您可以在服务器端分配 ImageUrl,即

    var obj= GetUserImages(); //method fetching image urls from db.
    photo1.ImageUrl = obj.ImageUrl1;
    photo2.ImageUrl = obj.ImageUrl2;
    photo3.ImageUrl = obj.ImageUrl3;
    

    2。您可以简单地将 runat="server" 属性放在现有的 img 标签上,然后在服务器端访问它们并设置它们的 url。即在您的 img 上放置 runat="server",如下所示

    <img id="photo1" runat="server" class="stackphotos" src="photos/4.jpg"  >
    

    然后像

    一样在服务器端访问它
    photo1.Src = dbObject.Url;
    

    3。您可以在循环中从服务器端动态插入 imgs。

    string imgs = string.Empty;
    foreach(var item in GetAllUserImages())
    {
         images +="<img src='"+ item.ImageUrl +"' class='stackphotos' />";
    }
    div1.InnerHtml= images;
    

    div在哪里

    <div id="div1" runat="server">
    </div>
    

    4。你可以调用webmethod(你的.aspx.cs页面上的一个方法,用[WebMethod]属性标记并通过ajax调用它并在javascript函数中更新你的img标签。

    【讨论】:

    • 你能详细说明第二种方式吗?
    • 我尝试了第二种方法,但没有奏效。现在我正在尝试第一种方法,但似乎效果 jquery 效果不再起作用这是我正在尝试整合的专辑..youhack.me/demo/g%20plus%20photo
    • 等一下?为什么它不起作用?您指定的相对 url 可能是错误的。在谷歌浏览器中打开页面,检查元素,转到控制台并查看错误,它必须显示 404 错误,找不到图像。更正您的相对网址,即前缀 ~/ 或 ../ 或删除。
    • 我申请 runat="server" 的那一刻。它停止工作。
    • 或者,如果您不想更改 id ,只需在您的 img 标签上放置一个属性clientidmode="static"&lt;img id="photo1" runat="server" class="stackphotos" src="photos/4.jpg" clientidmode="static" &gt;
    【解决方案2】:

    页面:

    <%@ Page Language="C#" %>
    other page content
    <asp:PlaceHolder runat="server" ID="myimages" />
    other page content
    

    代码背后:

    protected void Page_Load(object sender, EventArgs e)
    {
    using(var db = new myDataContext()) // see linq to sql / entity framework
       foreach(var i in db.ImagesTable.Select(img => new { Id = img.Id }))  // ImagesTable is the name of your table with info about your images
          myimages.Controls.Add(new LiteralControl(@"<img src=""myimgdir/" + i.Id + "".jpg" class=""stackphotos"" />")); // presuming that images are named according to an id in the database
    
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2014-03-19
      • 1970-01-01
      • 2022-07-31
      • 1970-01-01
      • 2017-03-18
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多