Изменение всплывающего контента - PullRequest
Новая
       0

Изменение всплывающего контента

4 голосов
/ 13 сентября 2011

Я открываю всплывающее окно, используя popup = window.open(....), а затем пытаюсь вставить html в div во всплывающем окне.

popup.document.getElementById('div-content').innerHTML = "hello world"; ничего не делает, однако popup.document.getElementById('the-field').value = "Hello There"; изменяет содержимое поля с id = "the-field".

Есть идеи, почему один работает, а другой нет? Как я могу заменить содержимое div?

надеюсь, что вы можете помочь.

EDIT: всплывающее окно 

<!DOCTYPE html>
<html>
   <head>
        <title>Report</title>
        <meta charset="utf-8">
   </head>

    <body>
        <header>

        </header>

        <div id="div-content"></div>

        <div id="report-container">
            <input type="text" id="the-field" name="the_field"/>
        </div>

        <footer>
        </footer>

     </body>

 </html>

код 

  function reportComplete(report_content)
  {
  var popup;
  var template_path;

  template_path = base_url + "application/views/secure/reports_preview.php";
  popup = window.open(template_path, "Report", "scrollbars=yes ,resizable=yes");

  popup.document.getElementById('the-field').value = "Hello There"; // this works

  popup.document.getElementById('div-content').innerHTML = "hello world";

  }

Ответы [ 2 ]

5 голосов
/ 30 января 2012

... или просто: 

<script type="text/javascript">    
function reportComplete(report_content)
{
    var popup;
    var template_path;

    template_path = base_url + "application/views/secure/reports_preview.php";
    popup = window.open(template_path, "Report", "scrollbars=yes,resizable=yes");

    popup.window.onload = function() {
        popup.document.getElementById('the-field').value = "Hello There";
        popup.document.getElementById('div-content').innerHTML = "hello world";
    }
}
</script>
3 голосов
/ 13 сентября 2011

Я думаю, что проблема в том, что документ во всплывающих окнах не завершил загрузку, когда вы пытаетесь получить доступ к его части. На моей машине ни один из div-ов не может быть доступен с помощью предоставленного кода.

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

UPDATE: Существует способ запустить функцию манипулирования DOM, только когда всплывающее окно завершает загрузку. Во-первых, вам нужна функция обратного вызова в главном окне, и поместите туда весь код манипуляции DOM: 

window.callback = function(doc) {
    doc.getElementById('the-field').value = "Hello there";
    doc.getElementById('div-content').innerHTML = "Hello world";
}

Затем просто свяжите вызов функции с событием onload тела во всплывающем окне: 

<script type="text/javascript">
    function loaded() {
       window.opener.callback(document);
    }
</script>
<body onload="loaded();"><!-- body content --></body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...