Запуск JQuery в контексте другого фрейма

Клиент, с которым я работаю, имеет такой набор фреймов...

<frameset rows="100,*, 0">
  <frame name="theFrame" id="theFrame" src="blah.html" >
  <frame name="theSecondFrame" id="theSecondFrame" src="foo.html" >
  <frame name="importantFrame" id="importantFrame" src="myFrame.html" >
</frameset>

Когда происходит определенное действие, мне нужен мой фрейм (важный фрейм, который в настоящее время скрыт), чтобы в основном захватить страницу и заблокировать любое взаимодействие с другими фреймами. Я планирую блокировать взаимодействие с помощью плагина jquery block UI.

Проблема в том, что я не могу изменить файлы foo.html или blah.html. Так что код JS не может там жить. Что мне нужно сделать, так это выполнить мой код jquery в контексте этих фреймов. Итак, напомню, мне нужно, чтобы мой код JQuery жил в myFrame.html, но выполнялся в контексте других фреймов. Как я могу это сделать? Надеюсь, это имеет смысл.

Спасибо CDR


html jquery frames
person ChrisDiRulli    schedule 12.02.2009    source источник

Ответы (4)


arrow_upward
81
arrow_downward

Функция jQuery, которую вы чаще всего вызываете с помощью $, принимает второй аргумент, называемый контекстом, который представляет собой «в каком элементе DOM объекта jQuery я должен выполнять поиск». В большинстве случаев вы опускаете этот аргумент, поэтому по умолчанию используется контекст текущего HTML-документа. Когда ваш код выполняется в iframe, документ по умолчанию соответствует документу этого iframe. Но вы можете легко взять документ для одного из других кадров.

Например, поместите это в myFrame.html, и это удалит все элементы h1 из кадра с blah.html в нем. Обратите внимание на второй аргумент $, который является выражением, которое захватывает бла-фрейм внутри важного фрейма:

<html>
  <head>
    <script type="text/javascript" src="/javascripts/jquery.js"></script>
    <script type="text/javascript">
      function doIt() {
        $('h1', window.parent.frames[0].document).remove()
      }
    </script>
  </head>
  <body>
    <h1>My Frame</h1>
    <a href="#" onclick="doIt()">Do It</a>
  </body>
</html>
person pjb3    schedule 20.02.2009
comment
Хороший ответ - я собирался задать аналогичный вопрос! - person CMPalmer; 04.04.2009
comment
Вы также можете написать часть window.parent.frames[0].document как window.parent.theFrame.document, что будет более подробно. - person joar; 07.09.2010

arrow_upward
4
arrow_downward

Как сказал pjb3, установите контекст jQuery. Если у вас есть вложенные фреймы, ваш код будет выглядеть так:

$('*',window.parent.frames[0].frames[0].document).size();

Или, еще лучше, сделать ярлык:

targetFrame = window.parent.frames[0].frames[0].document;
$('*',targetFrame).size();
person Patrick Fisher    schedule 22.09.2009

arrow_upward
0
arrow_downward

Я не уверен насчет блочного плагина, но вы не можете получить соответствующий фрейм и манипулировать им, используя «дерево фреймов», что-то вроде этого: (из ImportantFrame.htm)

parent.theFrame.someProperty = someValue;

eg:

parent.theFrame.location.href='anotherPage.html';

Из того, что я читал, вам может понадобиться Jquery на целевой странице, но вы можете попробовать что-то вроде:

parent.theFrame.block();

или, может быть:

$('#theFrame').block();
person Andrew M    schedule 14.02.2009

arrow_upward
0
arrow_downward

В версиях jQuery>=1.7 мы не можем получать события по-старому.

Старые версии (‹1.7):

var events = $('#form').data('events');

1.7 и новее:

var events = $.fn.data($('#form'), 'events');
person aliaksej    schedule 09.01.2012