在asp.net和c＃中使用Nivo SLider中的編程圖像

Question

「只有在鏈接中包含的圖像或圖像才允許在滑塊div中，任何其他HTML都會打破滑塊。

什麼是在c＃中編程插入圖像數據庫的最佳方式？ 我在div id =「slider」標籤中使用了一個標籤，但後來認識到標籤會在span標籤內創建圖像，並因此打破滑塊。

lblSlider.Text += "<img src=\"" + URL + "\" alt=\"" + address + "\" title=\"<a href='Featured/" + address" + address + ", " + city + "</a>\" />"; 

Answer 1

好吧，我還沒有嘗試過其他的解決方案，但我做到了這一點，它的工作原理如下： 以下是一些全局c＃變量：

protected int count; 
protected string[] arr = new string[20]; 

然後我在Page_Load方法中從我的數據庫中爲字符串數組賦值。

然後，我只寫我的網頁上的NIVO滑塊使用javascript：

<script type="text/javascript"> 
     document.write("<div id='slider' class='nivoSlider'>"); 
     var count = <%= count %>; 
     var myArray = <% = new JavaScriptSerializer().Serialize(arr) %>; 
     for(var i = 0; i < count; i++) { 
      document.write(myArray[i]); 
     } 

     document.write("</div>"); 
    </script> 

該解決方案似乎更容易給我，但如果有人認爲我應該使用其他的解決了這一個，讓我知道。哦，別忘了命名空間System.Web.Script.Serialization

Answer 2

使用類似這樣的標記......

<img src='ImageHandler.ashx?ProductID=<%# Eval("ProductID")%>' 
    alt="<%# Eval("ProductName") %>" title="<%# Eval("ProductName") %>" /> 

...與圖像結合HttpHandler的類像這樣（改編爲自己的特定的數據庫架構）：

public class ImageHandler : IHttpHandler 
{ 
    public void ProcessRequest(HttpContext context) 
    { 
     if (context.Request.QueryString["productID"] != null) 
     { 
      try 
      { 
       string ProductID = context.Request.QueryString["ProductID"]; 
       if (Convert.ToInt32(ProductID) > 0) 
       { 
        const string CONN 
         = "Initial Catalog=xxx;Data Source=xxx;Integrated Security=SSPI;"; 

        string selectQuery 
         = "SELECT Photo FROM dbo.Products WHERE dbo.Products.ProductID=" 
          + ProductID.ToString(); 
        SqlConnection conn = new SqlConnection(CONN); 
        SqlCommand cmd = new SqlCommand(selectQuery, conn); 

        conn.Open(); 
        SqlDataReader dr = cmd.ExecuteReader(); 

        dr.Read(); 
        context.Response.BinaryWrite((Byte[])dr[0]); 
        dr.Close(); 
        conn.Dispose(); 
        // context.Response.End(); 
        // caused an "Abort thread" error 
        // - this is correct and is a special exception 
       } 
      } 
      catch (Exception ex) 
      { 
       ErrorReporting.LogError(ex); 
      } 
     } 
     else 
      throw new ArgumentException("No ProductID parameter specified"); 
    } 

    public bool IsReusable 
    { 
     get 
     { 
      return true; // multiple images otherwise false 
     } 
    } 
} 

Answer 3

我有同樣的要求，並嘗試下面的代碼來完成基於類別的圖像的動態加載。這些圖像從我的數據庫加載。我是新來的ASP.Net請讓我知道如果我做了任何錯誤或做了任何失誤:)。

在ASP.Net文件： 我使用NIVO滑塊append方法

<script type="text/javascript"> 
    $(window).load(function() { 

     $('#slider').append('<img id="ad5" src=<%=__ad1ImageUrl %> />'); 
     $('#slider').append('<img id="ad6" src=<%=__ad2ImageUrl %> />'); 
     $('#slider').append('<img id="ad7" src=<%=__ad3ImageUrl %> />'); 
     $('#slider').append('<img id="ad8" src=<%=__ad4ImageUrl %> />'); 
     $('#slider').nivoSlider(); 
    }); 
</script> 

我的表看起來像這樣：

<table style="height: 183px; width: 100%" cellpadding="0" cellspacing="0" border="0"> 
    <tr> 
     <td align="left"> 
      <div id="wrapper"> 
       <div class="slider-wrapper theme-default"> 
        <div class="ribbon"> 
        </div> 
        <div id="slider" class="nivoSlider"> 
<!-- note that no images added here --> 
        </div> 
       </div> 
      </div> 
     </td> 
    </tr> 
</table> 

在後面的代碼： 使用變量來存儲圖片的網址（S）。您現在可以從數據庫獲取URL並進行填充。在我的代碼中，我使用了這些變量（也可以使用數組）來捕獲url路徑。您可以從像數據庫，XML任何來源獲得路徑或...

public string __ad1ImageUrl = ""; 
public string __ad2ImageUrl = ""; 
public string __ad3ImageUrl = ""; 
public string __ad4ImageUrl = ""; 

protected void Page_Load(object sender, EventArgs e) 
{ 
    if (!IsPostBack) 
    { 
     __ad1ImageUrl = "UserControls/Images/mainBanner1.jpg"; 
     __ad2ImageUrl = "UserControls/Images/mainBanner2.jpg"; 
     __ad3ImageUrl = "UserControls/Images/mainBanner3.jpg"; 
     __ad4ImageUrl = "UserControls/Images/mainBanner4.jpg"; 
    } 
}