Существует ли способ определять источники повторного изображения в HTML/JavaScript?

Это очень просто с Skip и Take дополнительные методы.

var query = from i in ideas
            select i;

var paggedCollection = query.Skip(startIndex).Take(count);
5
задан Imagist 27 October 2009 в 17:15
поделиться

6 ответов

Мне это кажется плохой идеей. Какова цель этой функции? Похоже, вам нужно что-то эквивалентное этому:

<img src="/images/file1.jpg" src2="/images/file2.jpg" src3="/images/file3.jpg">

Где браузер будет последовательно проверять каждый файл. Проблема с этим подходом заключается в том, что он значительно увеличивает требуемый HTTP-трафик и задержку. Наилучший подход - заранее динамически создать страницу с использованием правильных тегов изображений. Используя подход на стороне сервера, вы можете попытаться загрузить изображение с диска (или базы данных или где бы то ни было изображения) и динамически включить лучший URL-адрес в тег изображения страницы.

Если вы настаиваете на том, чтобы сделать это на стороне клиента, вы можете попробовать загрузить несколько тегов изображений:

<img src="file1.jpg" alt="" onerror="this.style.display='none'">
<img src="file2.jpg" alt="" onerror="this.style.display='none'">
<img src="file3.jpg" alt="" onerror="this.style.display='none'">
<img src="file4.jpg" alt="" onerror="this.style.display='none'">
<img src="file5.jpg" alt="" onerror="this.style.display='none'">
<img src="file6.jpg" alt="" onerror="this.style.display='none'">

Это приведет к тому, что на странице будет много изображений, но они исчезнут при загрузке страницы. alt = "" требуется, чтобы Opera не отображала заполнитель неработающего изображения; ошибка onerror требуется для Chrome и IE.

Если это недостаточно элегантно, и если все ваши изображения имеют одинаковый размер, и этот размер известен, вы можете сложить кучу изображений одно поверх из другого, так что первое загруженное изображение скрывает все остальные. У меня это сработало в Opera, FF и IE8. Он загружает последнее существующее изображение в списке. Обратите внимание, что это тратит впустую полосу пропускания и память, потому что загружается каждое изображение.

<div style="width: 50px; height:38px; background-image: url(file1.jpg);">
<div style="width: 50px; height:38px; background-image: url(file2.jpg);">
<div style="width: 50px; height:38px; background-image: url(file3.jpg);">
<div style="width: 50px; height:38px; background-image: url(file4.jpg);">
<div style="width: 50px; height:38px; background-image: url(file5.jpg);">
<div style="width: 50px; height:38px; background-image: url(file6.jpg);">
<div style="width: 50px; height:38px; background-image: url(file7.jpg);">
</div></div></div></div></div></div>

Наконец, есть подход JavaScript:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
  <head>
    <title></title>
    <script type="text/javascript">
      var image_array = ['file1.jpg', 'file2.jpg', 'file3.jpg', 'file4.jpg', 'file5.jpg','file6.jpg' ];
      function load_img(imgId, image, images, index) {
        image.onerror = function() {
          load_img(imgId, this, images, index+1);
        };
        image.onload  = function() {
          var element = document.getElementById(imgId); 
          if (element) {
            element.src = this.src; 
            element.style.display = 'block';
          }
        };  
        image.src = images[index];
      }
    </script>
  </head>
  <body>
    <img id="id_1" alt="" style="display: none;">
  </body>
  <script>
        load_img('id_1', new Image(), image_array, 0);
  </script>
</html>
2
ответ дан 13 December 2019 в 22:10
поделиться

If by saying "works" you mean the image can be loaded, you can use the "load" function on an image( in your case a bunch of images) of jQuery and inside of it declare the functionality that will be fire once the loading of the an image is completed.

If by saying "works" you mean that the HTTP status code is ok then use an ajax call using jquery.

function getUrlStatus(url) {
     $.ajax({
         url: url,
         complete: function(xhr) {
             return xhr.status;
         }
     });
 }
1
ответ дан 13 December 2019 в 22:10
поделиться

Если я правильно читаю спецификацию, вы сможете сделать это с помощью элемента HTML объекта . Теги могут быть вложенными и, таким образом, обеспечивать цепочку ресурсов, каждый из которых пытается по очереди отрисовать, и в случае сбоя пользовательский агент переходит к следующему.

Однако обратите внимание, что это поведение было ошибочным для некоторых браузеров и версий.

3
ответ дан 13 December 2019 в 22:10
поделиться

Предполагая, что вы имеете в виду, что браузер может получить некоторый контент с кодом ответа HTTP 200 для определенного URL-адреса. , то ответ: НЕТ со стороны клиента, используя только HTML.

Другими словами, вы не можете иметь элемент (например, img) и указывать несколько URL-адресов для «попытки».

Конечно, вы можете создать что-то на стороне сервера: поступает запрос на ресурс X, и у сервера есть список URL-адресов, которые "работают".

1
ответ дан 13 December 2019 в 22:10
поделиться

Вы можете ввести URL-адрес какого-либо сервера -стороннее приложение / сценарий, который обслуживает изображение из любого источника изображения, который он может найти.

Вы можете сделать это в ASP.Net с помощью HTTPHandler, который отправляет ответ content-type = image / jpg.

Кроме ASP.Net есть множество других серверных опций, таких как Perl, PHP ...

0
ответ дан 13 December 2019 в 22:10
поделиться

INAJNBAM (I'm not a Javascript Ninja by any means), but in pseudo code, maybe try something like this after the page has loaded: (OR, now that I think about it, this would work well with PHP too)

$images = array('img1.jpg', 'img2.jpg', 'img3.png'....)
    foreach $images as $img
        {if $img.height > 0px
            {print "<img src="$img" />"
            end}
        };;;;

In fact PHP would be even better because I presume in JS this would result in images flashing up on the screen at the end of the pageload. Try it out in PHP and see if something like this fits your bill.

NOTE: I added 4 semi colons at the end. I know Javascript always wants 'em, I just didn't know where to stick them.

1
ответ дан 13 December 2019 в 22:10
поделиться
Другие вопросы по тегам:

Похожие вопросы: