0

我正在使用mjpeg格式来显示来自 IP 摄像机的流。问题是流不稳定,我不知道它什么时候开始,所以我需要以某种方式检查图像 url,如果有例如 > 5 个图像,然后加载它。像这样,但在将其添加到页面之前检查url 。

目前我有:

$('#image_div').append('<img width="320" height="240" border="0" src="http://'+url+':'+port+'/?up" id="image">');
$('#image').load(function(){
    console.log($(this));
});

在控制台中它看起来像:http: //i.stack.imgur.com/iM88J.png

如果没有流,我只接收其中一个。所以我需要在添加之前以某种方式检查它。

4

2 回答 2

1

这是我过去使用过的一个很棒的插件。在大多数情况下,它可以在大多数浏览器中顺利运行。

https://github.com/desandro/imagesloaded

于 2012-09-06T13:03:54.033 回答
0

我不确定这是做什么的:

$('#image_div').append('<img src="http://'+url+':'+port+'/?up">');

我从未使用过 mjpeg 和 javascript,但我认为这个 URL 是 jpeg 流。

无论如何,您可以创建图像对象,将它们加载到内存中并随时显示它们。前:

var cache = [];
$(new Image()).attr('src', 'http://'+url+':'+port+'/?up').load(function() {
    // image loaded but not injected
    cache.push(this);
    if ( cache.length == 5 ) {
        // 5 images loaded, do something with cache array
    }
});

这回答了你的问题了吗?

于 2012-09-06T13:49:21.017 回答