Скрипт для динамического изменения источника тега iframe

Мне нужен код, который будет динамически изменять источник тега iframe при нажатии гиперссылки, например, у меня есть одна главная страница, которая должна загружать контент с других веб-страниц с использованием тега iframe при нажатии гиперссылки, но я не знаю, как сделать это. Вот мой код

<html>
  <head>
    <title>
    </title>

    <style type="text/css">
      #content {
        margin-right:30%;
        margin-bottom: 10px;
        padding: 10px;
        border: 1px solid #000;
        margin-left: 17%;
        background-repeat: no-repeat;
        width: 686;
        height: 640;
      }
    </style>

    <script type="text/javascript">

      function hyperlinkChanger(hyperLink) 
      {

        switch (hyperLink)
        {

          case "home":
            var url="home.html";
            return url;
            break;

          case "about_Us":
            var url="about_us.html";
            return url;

            break;

          case "contact_Us:
            var url="contact_us.html";
            return url;

            break;
        }
      }
    </script>
  </head>
  <body>
    <a href="home.html" name="home" onClick="hyperlinkChanger('home')">Home</a>
    <br />
    <a href="about_us.html" name="about_Us" onClick="hyperlinkChanger('about_Us')">About Us</a>
    <br />
    <a href="contact_us.html" name="contact_Us" onClick="hyperlinkChanger('contact_Us')">Contact us</a>
    <br />

    <div name="content">
      <!--please help me write a method to call the output of the funcion hyperlinkChanger-->
      <iframe src="hyprlink function" width="600" height="300">
      </iframe>
    </div>
  </body>
</html>

javascript html iframe css xhtml
person sammyukavi    schedule 23.11.2011    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Без JavaScript:

<html>
<body>
    <iframe id="foo"></iframe>
    <a href="http://stackoverflow.com/questions/8240078/script-to-dynamically-change-the-source-of-an-iframe-tag" target="foo">This page</a>
</body>
</html>

Вы можете настроить таргетинг на локальные или внешние ссылки. Обратите внимание, что в этом примере javascript, запущенный в Stack Overflow, обнаруживает, что его страница загружается в iframe, и отправляет уведомление пользователю. Некоторые сайты этого не делают. Существуют даже методы, позволяющие определить, загружается ли ваша страница в iframe, и вместо этого перенаправить родительскую страницу непосредственно на ваш сайт. Если все, что вы делаете, это загружаете свои собственные страницы, вам не нужно об этом беспокоиться.

person Geuis    schedule 23.11.2011
comment
Это динамическая страница. Я хочу, чтобы одна главная страница отображала другие страницы в iframe при нажатии на ссылку. - person sammyukavi; 23.11.2011
comment
Хорошо, тогда просто обновите href ваших якорей. Это все, что вам нужно сделать. - person Geuis; 23.11.2011
comment
Вот чего я не умею в javascript - person sammyukavi; 23.11.2011
comment
Я уже ответил на ваш вопрос. Вам вообще не нужно использовать javascript для этого. Дайте вашему iframe идентификатор. Затем просто добавьте атрибут target=‹id› к каждому из ваших якорей, где ‹id› — это идентификатор iframe. - person Geuis; 27.11.2011

arrow_upward
0
arrow_downward

Во-первых, зачем это делать с JAVASCRIPT? Вы можете просто использовать атрибут target для элемента a!

Но если вам нужно использовать javascript, сделайте что-то вроде этого: declare var url = ''; перед оператором switch Удалите возвраты из случаев переключения. После оператора switch добавьте следующее: $('iframe').attr('src', url);

person Stijn_d    schedule 23.11.2011
comment
Почему голосование против? Просто дайте iframe идентификатор и создайте элемент a следующим образом: '‹a href=google.com target =[iframe-id]›открыть Google в iframe с идентификатором [iframe-id]‹/a›' Просто замените [iframe-id] на имя по вашему выбору - person Stijn_d; 23.11.2011