як отримати доступ до батьківської сторінки iFrame за допомогою jquery?


267

У мене є iframe і для доступу до батьківського елемента я реалізував наступний код:

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

Як отримати той же результат за допомогою jquery?
ОНОВЛЕННЯ : Або як отримати доступ до батьківської сторінки iFrame за допомогою jquery?


Відповіді:


489

Щоб знайти у батьківській програмі iFrame, використовуйте:

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

Другий параметр для обгортки $ () - це контекст для пошуку. Це за замовчуванням для документування.


18
Класно - ви визнали подяку, перш ніж він подякував вам. Можливо, у StackOverflow виникають проблеми з часовими поясами?
belugabob

21
Ви також можете зробити: $ (window.parent.document) .find ("# parentPrice"). Html ();
jhorback

@belugabob Провина майстра.
Ерік Ескобедо

1
Для тих, хто запустив віндоїд з window.open, не забудьте про той старий стандартний JS стандарт window.opener.document. $ ("# someDiv", window.opener.document) працює.
jjohn

2
Це буде працювати лише в тому випадку, якщо джерело iframe завантажено jQuery. На мій досвід, у джерела iframe не було б jQuery, але часто потрібно викликати одну з функцій jQuery з батьків. Для цього використовуйте: window.document. $ ("# ParentPrice"). Html () На це була відповідь Альваро Г. Вікаріо.
Девід Кінкейд

39

Як отримати доступ до батьківської сторінки iFrame за допомогою jquery

window.parent.document.

jQuery - це бібліотека на вершині JavaScript, а не повна її заміна. Вам не потрібно замінювати кожен останній вираз JavaScript чимось, що включає $.


6
+1. jQuery чудовий, але багато відповідей на прості проблеми, здається, "використовувати jQuery". Якщо ви все одно завантажуєте бібліотеку, добре, але не завантажуйте її одним завданням. Крім того, люди здаються занепокоєними JS perf, тоді використовуйте API поверх JS, щоб зробити все легко (а можливо і швидше) без API.
Грант Вагнер

1
@Grant Хоча я мрію, щоб jQuery став рідним кодом у веб-переглядачах.
Ден Удар

3
@Blowski: це мій кошмар! jQuery містить безліч надзвичайно складних і тендітних кодів "робіть, що я маю на увазі", які було б абсолютно недоцільно розміщувати в офіційному API.
bobince

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

І якщо у вас є кілька вкладених кадрів iframes і ви хочете отримати доступ до найвищої рамки iframe, ви можете використовувати window.topтак:

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

Що таке:

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

7

у батьківському вікні поставити:

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

і у файл iframe src покласти:

<script>window.parent.ifDoneChildFrame('Your value here');</script>

5

так, це працює і для мене.

Примітка: нам потрібно використовувати window.parent.document

    $("button", window.parent.document).click(function()
    {
        alert("Functionality defined by def");
    });

5

Це працює для мене з невеликим поворотом. У моєму випадку я повинен заповнити значення від POPUP JS до форми для батьків.

Тож я звик $('#ee_id',window.opener.document).val(eeID);

Відмінно !!!


3

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


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")
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.