Обход /Управление новым окном из родительского окна с помощью jquery
Я уже нашел вопрос с возможным решением, но я уже попробовал предложенный метод перед его чтением, и он даже говорит, что он противоречив. Думаю, мне интересно, почему это не работает?
$("img").click(function() {
var imgwindow = window.open('imgwin.html','','width=460,height=345');
alert(imgwindow.find("img").attr("src"));
});
Цель состоит в том, чтобы установить img
в новом окне на тот же src
как изображение, которое пользователь щелкнул, чтобы открыть новое окно. Но в приведенном выше сценарии я просто пытаюсь подключиться к новому окну, чтобы получить уже установленный src. У меня imgwin.html
уже написано по умолчанию src
Для изображения, поэтому следует предупредить, что URL. Вместо этого я просто получаю undefined
.
Я также попробовал следующее (которое должно быть идентичным на серверной части), но с теми же результатами:
$("img").click(function() {
var imgwindow = window.open('imgwin.html','','width=460,height=345');
alert($("img",imgwindow).attr("src"));
});
Я даже пробовал разные варианты переноса переменной imgwindow
в $()
на случай, если jquery не определит переменную как элемент DOM.
Единственное, что я могу догадаться, так это то, что window.open()
является методом, jquery не рассматривает его как элемент DOM, даже хотя вся документация из базовых учебных пособий по javascript рассматривает переменную как метод для открытия окна и указатель на внутренний DOM окна.
Примечание:
Я обычно предпочитаю и рекомендую другим разработчикам использовать диалоговый виджет jquery-ui, но в этом сценарии изображения на самом деле представляют собой каналы веб-камеры, которые пользователь захочет открыть в главном окне и открыть, даже если Главное окно закрыто, поэтому, хотя я ценю переход от всплывающих окон в целом, пожалуйста, избегайте предлагать альтернативы, которые включают виджеты из одного окна. Спасибо.
2 ответа
Быстро и грязно
var src = '';
var imgwindow;
$(function() {
$("img").click(function() {
imgwindow = window.open('urlto.html','','width=460,height=345');
src = this.src;
//delay needed as I couldn't manage to get ready/load events to work on the
//imgwindow.document object
//thus the snippet is dirtier then need with all those "global" variables
setTimeout('$("img", imgwindow.document.body).attr("src", src)', 1000);
});
});
Примечание. Проверено только в Opera. imgwindow.document
может работать не для всех браузеров. По крайней мере, я помню, что были проблемы с iframe, где document /contentDocument и, возможно, другие «идентификаторы» необходимы для получения «документа» нового окна /iframe. Но просто протестируйте в любом браузере, который вам нужно поддерживать
почему бы просто не сделать это
$("img").click(function(e) {
var src = $(this).attr('src');
window.open(src,'','width=460,height=345');
});
Откроется новое окно с вашим изображением внутри! ; -)
UPDATE
В ответ на ваш комментарий нужно сделать что-то вроде этого:
$("img").click(function(e) {
//Load content in your page and hide it...
$('#result').load('imgwin.html').hide();
//find the image you want...
alert($('#result').find("img").attr("src"));
//remove it from your page..
$('#result').remove();
});
ОБНОВЛЕНИЕ 2
Хорошо, все еще на этом, мне это нравится! ; -)
попробуйте это
var reg = /src=\"(.+[\.jpg|\.jpeg|\.png|\.gif])\"/;
var imgwindow = $.ajax({type: "GET", url: "imgwin.html", async: false }).responseText;
var img = imgwindow.match(reg)[1];
alert(img);