Webkit: доступ к объекту DOMWindow, возвращенному из window.open () - PullRequest
Новая
       9

Webkit: доступ к объекту DOMWindow, возвращенному из window.open ()

0 голосов
/ 08 февраля 2011

У меня есть несколько base64 кодированных изображений. Эти изображения имеют обработчик события click , который открывает новое окно / tab и добавляет изображение в это вновь созданное окно. Это прекрасно работает в Firefox (тестирование на 3.6.x), но пока все браузеры WebKit по каким-то причинам запрещают доступ к объекту окна . *

Пример 

jQuery('<img>', {
    src: "data:image/png;base64,R0lGODlhDQAOAJEAANno6wBmZgAAAAAAACH5BAAAAAAALAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D",
    click: function() {
        var largeprev = window.open('data:text/html;charset=utf-8,' + escape('<div/>'), 'large'),
            that      = this;

        largeprev.addEventListener('DOMContentLoaded', function(e) {
            largeprev.alert('loaded');
            largeprev.document.querySelectorAll('div')[0].appendChild(that);
        }, false);
    }
}).prependTo(document.body);

Код в действии: http://www.jsfiddle.net/bM6uY/

Я весь день возился с этим. Мне нужно создать новое окно, передав data-uri с типом содержимого text / html, чтобы в новом окне был какой-то узел, в который я могу добавить изображение. Это необходимо, потому что если вы имеете дело с огромными изображениями и просто передаете кодировку base 64 в window.open () , все эти данные поступят в URL-бар , который сильно замедляет работу.

Поэтому у меня возникла идея открыть новое окно с узлом и применить магию Javascript для добавления изображения.

Отлично работает в FF, но я не могу найти решение для Chrome / Safari. Любая идея приветствуется.

Обновление

Похоже, что единственным кросс-браузерным рабочим решением на сегодня является document.write(): 

jQuery('<img>', {
    src: "data:image/png;base64,R0lGODlhDQAOAJEAANno6wBmZgAAAAAAACH5BAAAAAAALAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D",
    click: function() {
        var virtualdom = '<html><body><img src="' + this.src + '"/></body></html>',
            prev       = window.open('', 'large');

        prev.document.open();
        prev.document.write(virtualdom);
        prev.document.close();
    }
}).prependTo(document.body);

Код в действии: http://www.jsfiddle.net/bM6uY/3/

Ответы [ 2 ]

0 голосов
/ 07 августа 2012

Похоже, что единственным кросс-браузерным рабочим решением на данный момент является document.write (): 

jQuery('<img>', {
    src: "data:image/png;base64,R0lGODlhDQAOAJEAANno6wBmZgAAAAAAACH5BAAAAAAALAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D",
    click: function() {
        var virtualdom = '<html><body><img src="' + this.src + '"/></body></html>',
            prev       = window.open('', 'large');

        prev.document.open();
        prev.document.write(virtualdom);
        prev.document.close();
    }
}).prependTo(document.body);
0 голосов
/ 09 февраля 2011

Не проще ли открыть пустой HTML-документ с изображением с атрибутом src, для которого задан URL-адрес данных? 

var data = "data:image/png;base64,RASSf4wwedfAAAA....",
    html= "<html><head> <title>Image Preview</title></head>"+
                "<body><img src='"+data+"'></img></body></html>",
    largePreview = open('');
largePreveiw.document.write(html);
largePreveiw.document.close();

с использованием HTMLDocument.write не лучше, но я недумаю, что есть элемент, к которому вы можете добавить контент ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...