Как получить доступ к родительской странице iFrame с помощью jquery?

267

У меня есть iframe и для доступа к родительскому элементу я реализовал следующий код:

window.parent.document.getElementById('parentPrice').innerHTML

Как получить тот же результат, используя jquery?
ОБНОВЛЕНИЕ : Или как получить доступ к родительской странице iFrame с помощью jquery?

javascript jquery iframe Амр Элгархи
источник
См. Также stackoverflow.com/questions/12114243/…
Алексис Уилк

Ответы:

489

Чтобы найти в родительском элементе iFrame используйте:

$('#parentPrice', window.parent.document).html();

Второй параметр для оболочки $ () - это контекст для поиска. По умолчанию это документ.

Пим Ягер
источник
18
Круто - ты признал благодарность, прежде чем поблагодарить тебя. Возможно, у StackOverflow проблемы с часовыми поясами?
Белугабоб
21
Вы также можете сделать: $ (window.parent.document) .find ("# parentPrice"). Html ();
Джорбинг
@belugabob Это ошибка волшебника.
Эрик Эскобедо,
1
Для тех, кто запустил windoid с помощью window.open, не забывайте об этом старом стандарте JS window.opener.document. $ ("# someDiv", window.opener.document) работает.
Джоан
2
Это будет работать, только если в источник iframe загружен jQuery. По моему опыту, у источника iframe не было бы jQuery, но часто требуется необходимость вызова одной из родительских функций jQuery. Для этого используйте: window.document. $ ("# ParentPrice"). Html () Это был ответ, опубликованный Альваро Г. Викарио.
Дэвид Кинкед
39

как получить доступ к родительской странице iFrame с помощью jquery

window.parent.document.

jQuery - это библиотека поверх JavaScript, а не полная ее замена. Вам не нужно заменять каждое последнее выражение JavaScript чем-то, включающим $.

bobince
источник
6
+1. jQuery великолепен, но многие ответы на простые проблемы, похоже, «используют jQuery». Если вы все равно загружаете библиотеку, хорошо, но не загружайте ее одной задачей. Кроме того, люди, похоже, обеспокоены JS-перфомансом, а затем используют API поверх JS, чтобы делать вещи легко (и, возможно, быстрее) без API.
Грант Вагнер
1
@Grant Хотя я мечтаю о том, чтобы jQuery стал нативным кодом в браузерах.
Дэн Блоу
3
@Blowski: это мой кошмар! jQuery содержит много чрезвычайно сложного и хрупкого кода «делай, что я имею в виду», который было бы совершенно неуместно добавлять в официальный API.
Бобинц
1
@bobince: Очевидно, вы всегда должны заменять весь Javascript на jQuery. Это как бекон; нет ситуации, в которой чем меньше, тем лучше. ;)
МВт.
2
У ОП уже был файл window.parent.document, поэтому он ничего не ответил. И представьте себе, что логика селектора намного сложнее, чем идентификатор элемента, ситуация, в которой jQuery чертовски удобен. Я чувствую, что вопрос «как сказать« привет »по-французски?» и этот ответ "говорить по-немецки".
grantwparks
13

Если вам нужно найти экземпляр jQuery в родительском документе (например, для вызова вспомогательной функции, предоставляемой плагином), используйте один из этих синтаксисов:

  • window.parent.$
  • window.parent.jQuery

Пример:

window.parent.$.modal.close();

JQuery привязывается к windowобъекту, и это то, что window.parentесть.

Альваро Гонсалес
источник
Я использую свой iframe как пользовательский элемент управления. Это позволяет мне держать его в чистоте и порядке.
Дэн Рэндольф
11

Вы можете получить доступ к элементам родительского окна из iframe, используя window.parentвот так:

// using jquery    
window.parent.$("#element_id");

Который так же, как: 

// pure javascript
window.parent.document.getElementById("element_id");

И если у вас есть несколько вложенных iframe, и вы хотите получить доступ к верхнему iframe, то вы можете использовать window.topтак:

// using jquery
window.top.$("#element_id");

Который так же, как: 

// pure javascript
window.top.document.getElementById("element_id");
Amr
источник
7

в родительском окне поставить:

<script>
function ifDoneChildFrame(val)
{
   $('#parentPrice').html(val);
}
</script>

и в файле iframe src поместите:

<script>window.parent.ifDoneChildFrame('Your value here');</script>
stieven
источник
5

да, это работает и для меня.

Примечание: нам нужно использовать window.parent.document

    $("button", window.parent.document).click(function()
    {
        alert("Functionality defined by def");
    });
Йогеш Ганди
источник
5

Это работает для меня с небольшим поворотом. В моем случае я должен заполнить значение от POPUP JS до формы PARENT WINDOW.

Итак, я использовал $('#ee_id',window.opener.document).val(eeID);

Превосходно!!!

Хитеш Патель
источник
3

Возможно, я немного опоздал к игре, но я только что обнаружил этот фантастический плагин jQuery https://github.com/mkdynamic/jquery-popupwindow . В основном он использует событие обратного вызова onUnload, поэтому он в основном ожидает закрытия дочернего окна и будет выполнять любые необходимые действия в этой точке. Так что на самом деле нет необходимости писать JS в дочернем окне, чтобы передать его родителю.

CJ5
источник
1

Есть несколько способов сделать это.

I) Получить главного родителя напрямую.

для примера. я хочу заменить свою дочернюю страницу на iframe тогда

var link = '<%=Page.ResolveUrl("~/Home/SubscribeReport")%>';
top.location.replace(link);

здесь top.location получает родительский объект напрямую.

II) получить родителей по одному,

var element = $('.iframe:visible', window.parent.document);

здесь, если у вас более одного iframe, укажите активный или видимый.

Вы также можете сделать это для получения дальнейших родителей,

var masterParent = element.parent().parent().parent()

III) получить родителя по идентификатору.

var myWindow = window.top.$("#Identifier")
Бхарат
источник