C# 如何逐个单元格加载表格

我有一个简单的表，每个单元格的div中有一个链接和一个图像。简化代码如下所示：

<td>
    <a href="#"></a>
    <div>
        <img src="image01.jpg" />
    </div>
</td>

我从数据库中提取链接和图像的值，并手动生成如下表：

cell = "<td>"
       + "<a href=\"#\"></a><div>"
       + "<img src=\"" + imageName + "\" "
       + "\" alt=\"" + imageName + "\" /></div></td>";

cell=“”
+ ""
+ "";

当用户悬停图像时，将显示另一个图像元素，以显示悬停图像的更大版本。这是通过javascript完成的

为了能够立即响应悬停，我实际上在表中加载了更大版本的图像。我调整并裁剪它们（因此父div）

由于该表有大约40-100个单元格，并且图像的宽度在180px到800px之间变化，因此我决定先加载空表，然后用每个单元格内容刷新页面。这样，用户将能够与加载的图像交互，而其余的图像仍在加载

我认为ajax循环可以在每次页面加载时触发，并将计数器设置为单元格总数。但我不知道怎样才能做到

有没有办法加载单元格的内容，向用户显示并加载下一个单元格

---

感谢您的时间。

您可以在javascript中完成此操作，并在的帮助下使代码更清晰

您将加载的HTML在

data src

属性上有图像名称，而

src

是您应该在服务器中提供的一个空白文件（此处名为

blank.gif

）：

这应该由代码生成：

cell = "<td><img src='blank.gif' style='width:" + imageWidth + 
        "px;" + imageHeight + "px' data-src='" + imageName + "' /></td>";

cell=”“；

提供宽度和高度是可选的。如果你能事先准备好，效果会更好。如果不能，则只有在加载图像时表才会成形

最后，要加载内容，请在HTML中的某个位置使用以下脚本：

<script>
$(function() {
    $("img").each(function() {
        var src=$(this).data("src"); //retrieve the data-src attribute
        if (src) $(this).attr("src", src); // if present, load the image
    });
})
</script>

$（函数（）{
$（“img”）。每个（函数（）{
var src=$（this.data（“src”）；//检索数据src属性
if（src）$（this.attr（“src”，src）；//如果存在，则加载映像
});
})

如果您在客户端进行这种HTML生成，您应该看看jQuery模板支持。如果您在服务器端使用它，更好的做法是使用某种重复控件（如）并以这种方式生成标记。您仍然可以控制图像和链接的生成方式。@R0MANARMY，谢谢。我接受了你的建议，选择了中继器控制。谢谢你，艾瑞尔，我尝试了你的解决方案，它似乎奏效了。不过，图像是以随机顺序加载的。你知道一种方法可以按照它们在表格中出现的顺序调用它们吗？我能想到的唯一方法是在每次作业之间设置一个小的延迟。如果你愿意，再写一个问题，我就给你看。（或其他人；）

<script>
$(function() {
    $("img").each(function() {
        var src=$(this).data("src"); //retrieve the data-src attribute
        if (src) $(this).attr("src", src); // if present, load the image
    });
})
</script>