我在使用动画 gif 时遇到了同样的问题。解决方法相当简单。

1. 在 Photoshop 中打开动画 gif。

2. 转到“窗口”选项卡并选择时间线（如果时间线尚未打开）。

3. 在时间轴面板的底部，您会找到一个选项，上面写着“永远”。将其更改为“一次”。

4. 转到文件> 导出> 导出为 Web 并将其另存为 gif。

那应该这样做。

你能找出gif循环一次需要多长时间吗？如果是这样，那么您可以像这样停止图像：

伪代码：

wait until the end of the image (when it is about to loop)
create a canvas element that has a static version of the gif as currently displayed drawn on it
hide gif
display canvas element in a way that makes it look like the gif froze

javascript:

var c = $("canvas")[0];
var w = c.width;
var h = c.height;
var img = $("img")[0];
setTimeout(function () {
    c.getContext('2d').drawImage(img, 0, 0, w, h);
    $(img).hide();
    $(c).show();
},10000);

提琴手

编辑： 我忘了添加对我从中获取的原始答案的引用，抱歉

以编程方式停止 GIF 动画

那个没有解决你只需要一个循环的时间因素

此外，有人提到这种方法在某些情况下是有问题的（当我现在在 Firefox 中尝试它时它实际上不起作用......）。所以这里有一些替代方案：

1. Mark 提到：编辑 gif 本身以避免循环。如果可以，这是最好的选择。但我遇到过它不是一种选择的情况（例如第三方自动生成图像）

2. 而不是用画布渲染静态图像，保持静态图像版本并切换到停止循环。这可能与画布一样存在大部分问题

实际上，可以在一次迭代或任何特定次数的迭代后使 gif 停止，请参见下面的示例（如果尚未停止）或在jsfiddle 中。

为此，必须使用指定的迭代次数创建 gif。这可以使用Screen to Gif来完成，它允许打开一个 gif 或一堆图像并逐帧编辑。

此解决方案还允许您通过以下方式重置动画，imgElem.src = imgElem.src;但这在 MS IE/Edge 中不起作用。

基于这个答案，它有点贵，但它有效。假设单个循环需要 2 秒。在 setInterval 2 秒后的 setTimeout 中，这将每毫秒重置图像源：

setTimeout(function() {
    setInterval(function() {
        $('#img1').attr('src',$('#img1').attr('src'))
    },1)
}, 2000)

再次，可能只是一个概念证明，但这里是演示：http : //jsfiddle.net/MEaWP/2/

不确定这是否是回应所有人的最佳方式，并在之前的所有答案和评论之后出现，但它似乎有效。

我对gif没有太多控制权。人们在他们的帐户目录中发布他们想要的任何 gif 作为“thankyou.gif”，然后当评论提交到他们发布的表单时，ThankYou 代码运行他们在那里放置的任何内容。所以有些可能会循环，有些可能不会，有些可能很短，有些可能很长。我提出的解决方案是告诉人们让它们保持 5 秒，因为那是我将它们淡出的时候，我不在乎它们是否循环.

感谢所有的想法。