Запустите JQuery в контексте другого фрейма - PullRequest
Новая
       24

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

39 голосов
/ 12 февраля 2009

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

<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.

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

Спасибо CDR

Ответы [ 4 ]

81 голосов
/ 20 февраля 2009

Функция 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>
4 голосов
/ 23 сентября 2009

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

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

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

targetFrame = window.parent.frames[0].frames[0].document;
$('*',targetFrame).size();
0 голосов
/ 09 января 2012

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

Старые версии (<1.7): </p> 

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

1,7 и новее: 

var events = $.fn.data($('#form'), 'events');
0 голосов
/ 14 февраля 2009

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

parent.theFrame.someProperty = someValue;

например: 

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

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

parent.theFrame.block();

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

$('#theFrame').block();
...