Способ асинхронно загружать сгенерированный сервером образ (требуется время для генерации) с использованием Ajax - PullRequest
1 голос
/ 26 мая 2011

Эй, ребята, я искал повсюду для этого.Я пытаюсь получить изображение, которое генерируется для асинхронной загрузки после загрузки страницы / css / других изображений на страницу.Это изображение на самом деле является диаграммой, созданной с помощью JFreeChart.Я хочу пойти дальше и загрузить страницу, но после этого появятся графики.Я думал, что нашел решение во втором примере, но, похоже, это не работает в IE8.Это просто показывает красный X. Кажется, он работает нормально в Chrome и Firefox.Мне просто интересно, есть ли лучший способ.Я также попробовал этот плагин. Похоже, это тоже не сработало.

http://www.sebastianoarmelibattana.com/projects/jail

   /* $(function () {
        var img = new Image();
        $(img).load(function () {
            $(this).hide();
            $('#loader').removeClass('loading').append(this);
            $(this).fadeIn();
        }).error(function () {

        }).attr('src', 'http://localhost/chart/3074/110/2011-05-15/2011-05-25');
    })
     */
    $(window).load(function() {     
        $("#test").load(function() {
            var img = this;
            $('.'+ID).fadeOut(function() { $(this).html(img); }).fadeIn();
        }).attr("src", 'http://localhost/chart/3074/110/2011-04-15/2011-05-25'); 
    });

Просто помните, что это не нормальное изображение.Он генерируется на лету на сервере, а затем подается на страницу.Спасибо за вашу помощь.

$(window).load(function() {       

    var insertedTable =  $('#pkgLineTable').dataTable({
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "bPaginate": true,
        "bLengthChange": true,
        "bFilter": true,
        "bSort": false,
        "bInfo": true,
        "bAutoWidth": false,       
        "bProcessing": true,
        "bServerSide": false,
        "sAjaxSource": '@{Overview.getPkgLineList()}',
        "fnServerData": fnServerObjectToArray(['shortname', 'description', 'lineStatus', 'statusStamp'])          
    });

    $('#test').attr('src', 'http://localhost/chart/3074/110/2011-04-15/2011-05-25');
    $('#test2').attr('src', 'http://localhost/chart/3074/110/2011-05-15/2011-05-25');
});   



<img src="/public/images/ajax-loader.gif" id="test"></img>
<img src="/public/images/ajax-loader.gif" id="test2"></img>

Ответы [ 2 ]

1 голос
/ 26 мая 2011

Вам не нужно #test для загрузки.Фактически, поскольку вы вызываете это для window.load, # test.load уже будет загружен, поэтому вы никогда не получите событие.

Вот простая версия того, что вы хотите:

$(window).load(function() {     
    $('#target_image').attr('src', 'http://localhost/chart/3074/110/2011-04-15/2011-05-25');
});

Предполагается, что img уже есть на странице с идентификатором 'target_image', потенциально без атрибута src.

Это может измениться в зависимости от того, как хранятся ваши данные, что выхочу сделать с этим и т. д. К сожалению, у нас нет этого контекста.

0 голосов
/ 26 мая 2011

Проверьте эту скрипку и попробуйте сделать то же самое:

http://jsfiddle.net/byM8g/2/

Я думаю, что все будет хорошо

...