Jquery延迟加载插件不能与datalist asp.net一起工作



我正在与数据学家和数据学家一起工作,数据学家将在页面中显示许多图像。所以我使用jquery懒惰加载插件,但它不工作,而抛出错误,我只是不明白。

这是我的代码

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery.js" type="text/javascript"></script>
<script src="Scripts/jquery.lazyload.min.js" type="text/javascript"></script>

</head>
 <body>
 <form id="form1" runat="server">
  <script type="text/javascript">
  $(function () {
      $("img").lazyload({ placeholder: "images/ajax-loader.gif", effect: "fadeIn" });
  });
  </script> 
<asp:DataList ID="dgImages" runat="server" RepeatColumns="4" 
    RepeatDirection="Horizontal" RepeatLayout="Flow">
    <ItemTemplate>
       <asp:image  runat="server"  src='<%# Eval("photos")%>' alt="IIS 7 settings" title="" /> 
    </ItemTemplate>
</asp:DataList>

</form>
</body>
</html>
protected void Page_Load(object sender, EventArgs e)
    {
        DataTable dt = new DataTable();
        dt.Columns.Add(new DataColumn("photos", Type.GetType("System.String")));
        DataRow row;
        string[] aryPhotos;
        string strPath = @"c:userstridipdocumentsvisual studio 2010Projects LazyLoadLazyLoadimagessnapdeals";
        aryPhotos = Directory.GetFiles(strPath, "*.jpg");
        foreach (string strPhoto in aryPhotos)
        {
            row = dt.NewRow();
            string strImg = "images/snapdeals/" + Path.GetFileName(strPhoto);
            row["photos"] = strImg;
            dt.Rows.Add(row);
        }
        }

这是我的示例HTML输出后绑定数据列表

<span id="dgImages"><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06531A_PINK_M_1_2x.jpg" src="" /> 
    </span><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06532A_pink_M_1_2x.jpg" src="" /> 
    </span><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06633A_BLUE_M_1_2x.jpg" src="" /> 
    </span><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06641A_CHERRY_M_1_2x.jpg" src="" /> 
    </span><br /><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06641A_pink_M_1_2x.jpg" src="" /> 
    </span><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/06641A_WHITE_M_1_2x.jpg" src="" /> 
    </span><span>
       <img alt="IIS 7 settings" title="" src="images/snapdeals/08334A_BLACK_M_1_2x.jpg" src="" /> 
    </span><span>

我只是不明白如何添加一个空的src标签。我的代码有什么问题?

在项目站点中,它说"Real image url应该存储为data-original属性。"src用作占位符图像。<img data-original="img/example.jpg" src="img/grey.gif">是网站的用法。