Добавление ссылки на URL в IFRAME - PullRequest
Новая
       22

Добавление ссылки на URL в IFRAME

3 голосов
/ 23 января 2012

У меня есть страница с IFRAME. IFRAME состоит из новостных ссылок на RSS-статьи. Я хотел бы добавить к каждой статье URL target = "_ blank", чтобы каждая статья открывалась в новом окне, а не в IFRAME. Я не хочу изменять макет или функцию исходной страницы новостной ленты, поэтому я стремлюсь динамически добавлять URL-адрес при нажатии. Главная страница и страница IFRAME находятся в одном домене. Любая помощь будет оценена.

Пример кода: 

<html>
<head>
</head>
<body>
<iframe src="http://vangopainting.net/painting-tips?tmpl=component"></iframe>
</body>
<html>

Как видите, приведенный выше URL тянет зачищенную страницу Joomla, с только показанным содержимым. Этот IFRAME будет встроен в страницу Facebook, и когда пользователь нажимает на ссылку, он внедряет в IFRAME весь сайт, а не только статью. Я хотел бы, чтобы это открылось в новом окне, а не в IFRAME, добавив target = "_ blank" к URL-адресу или даже добавив компонент? Tmpl = к URL-адресу, чтобы Joomla удалила все, кроме статьи.

Отредактировано, чтобы добавить: ОК ... вот мой код: 

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script>
    $(function() {
        $('iframe').load(function(){
            $('a',$(this).contents()).each(function(){this.href = this.href + "?tmpl=component";});
        });
    });
</script>
</head>
<body>
<iframe src="link.html" width="100%" height="50px" frameborder="0" scrolling="no"></iframe>
<iframe src="http://vangopainting.net/painting-tips?tmpl=component" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
</body>
</html>

Я добавил первый iframe только для тестирования в Facebook.

Содержимое в link.html: 

<html>
<head>
</head>
<body>
<a href="http://vangopainting.net/painting-tips/508-newest-mobile-app-matches-paint-color-instantly">http://vangopainting.net/painting-tips/508-newest-mobile-app-matches-paint-color-instantly</a>
</body>
</html>

Вот прямая ссылка на страницу: http://vangopainting.net/fb/tabs/paintingtips/index.html Все работает как надо.

А вот и ссылка на страницу Facebook: https://www.facebook.com/pages/Van-Go-Painting-Inc/177992368936448?sk=app_366401100043274 URL первого iframe добавляется, как и должно быть, но второй iframe остается без изменений.

Я в недоумении, почему это не работает.

Ответы [ 2 ]

1 голос
/ 23 января 2012

Это должно работать для вас. 

$('a',$('iframe').contents()).attr('target','_blank');

Короче говоря, он захватывает содержимое всех iframe s, находит их теги a и применяет соответствующий атрибут target.

Добавьте следующий (непроверенный) фрагмент кода внутри тега head в своем примере для достижения желаемого эффекта. 

<script>
    $(function() {
        $('iframe').load(function(){
            $('a',$(this).contents()).attr('target','_blank');
        });
    });
</script>

Существует много событий, ожидающих события в приведенном выше фрагменте.

  • Сначала мы ждем загрузки страницы с помощью , передавая функцию обратного вызова на $. Мы хотим дождаться загрузки страницы, чтобы знать, что мы можем найти наши iframe s.
  • Когда этот обратный вызов выполняется, мы находим все iframe s и прикрепляем другой обратный вызов, который будет вызываться при загрузке.
  • Этот другой обратный вызов является фрагментом кода, который фактически выполняет поиск тегов a и внесение в них изменений.
0 голосов
/ 23 января 2012

вы можете получить доступ к содержимому iframe с помощью .contents, а затем найти элементы внутри iframe с помощью .find, а затем с помощью each изменить элемент по своему вкусу, так как вы не предоставили никакого кода, поэтому я также собираюсьпридерживаться теоретического ответа

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...