我正在与数据学家和数据学家一起工作,数据学家将在页面中显示许多图像。所以我使用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">
是网站的用法。