jQuery меняет содержимое iFrame - PullRequest
       2

jQuery меняет содержимое iFrame

31 голосов
/ 29 февраля 2012

Я совершенно новичок в использовании jQuery.Почему это не работает?

<iframe width="800" scrolling="no" id="prev" src="">your browser needs to be updated.
</iframe>
<script src="jquery.js"></script>
<script>
    //var c = 0;
    $(document).ready(function() {
        $('#prev').contents().html("<html><body><div> blah </div></body></html>");
    })
</script>

Кроме того, я планирую использовать этот iFrame для предварительного просмотра изменений в html-файле для пользователя.Я собираюсь либо очищать весь iFrame каждый раз, когда вносятся изменения, либо, если я смогу выяснить, как это сделать, изменить отдельные строки с помощью jQuery.Это лучший способ сделать это?

Ответы [ 2 ]

49 голосов
/ 29 февраля 2012

Если вы хотите обновить содержимое iframe с помощью html, сначала вы должны найти элемент body внутри iframe, а затем добавить необходимую разметку.

$(document).ready(function() {
    $('#prev').contents().find('body').html('<div> blah </div>');
});

Рабочая демоверсия - http://jsfiddle.net/ShankarSangoli/a7r9L/

1 голос
/ 15 января 2019

Я создал PHP-скрипт, который может получить все содержимое с другого сайта, и наиболее важной частью является то, что вы можете легко применить свой собственный jQuery к этому внешнему контенту. Пожалуйста, обратитесь к следующему сценарию, который может получить все содержимое с другого веб-сайта, а затем вы также можете применить свой cusom jQuery / JS. Этот контент может использоваться где угодно, внутри любого элемента или любой страницы.

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
    Function to display frame from another domain 
*/

function displayFrame()
{
    $webUrl = 'http://[external-web-domain.com]/';

    //Get HTML from the URL
    $content = file_get_contents($webUrl);

    //Add custom JS to returned HTML content
    $customJS = "
    <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
      //Hide Navigation bar
      jQuery(\".navbar.navbar-default\").hide();

    </script>";

    //Append Custom JS with HTML
    $html = $content . $customJS;

    //Return customized HTML
    return $html;
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...