Обход / Управление новым окном из родительского окна с помощью jquery

Question

Я уже нашел вопрос с возможным решением, но я уже попробовал предложенный метод, прежде чем читать его, и он даже говорит, что он противоречив. Так что, думаю, мне интересно, почему это не работает:

$("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, но в этом сценарии изображения на самом деле представляют собой каналы веб-камеры, которые пользователь захочет выскочить из главного окна и открыть, даже если Главное окно закрыто, поэтому, хотя я ценю переход от всплывающих окон в целом, пожалуйста, избегайте предлагать альтернативы, которые включают виджеты с одинаковыми окнами. Спасибо.

Answer 1

Быстро и грязно

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. Но просто протестируйте в любом браузере, который вам необходим для поддержки

Answer 2

почему бы просто не сделать это

$("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);