Coddddder Ответов: 0

Открыть модальное окно с iframe в родительское окно

Я пытаюсь открыть модальный диалог на родительской странице из iframe (кнопка для открытия модального диалога находится в iframe, но модальный div находится на родительской странице). Но безуспешно.

У меня есть родительская страница, как показано ниже:-

<html xmlns="http://www.w3.org/1999/xhtml">
        <head>
            <title></title>
            <script src="basic.js"></script>
            <script src="jquery.simplemodal.js"></script>
        </head>
        <body>
            <iframe src="Frame-1.html" width="400" height="400"></iframe>
            <iframe src="Frame-2.html" width="400" height="400"></iframe>

            <div id="modalPopup" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                    </div>
                </div>
            </div>
        </body>
        </html>


И код в Frame-1.html это как ниже:-

<!DOCTYPE html>
    <html lang="en">
    <head>
        <title>Modal popup</title>
        <link rel="stylesheet" href="./bootstrap.min.css" />
        <script src="./jquery-1.11.1.min.js" type="text/javascript"></script>
        <script src="./bootstrap.min.js" type="text/javascript"></script>
        <script src="basic.js"></script>
        <script src="jquery.simplemodal.js"></script>
        <script>
            $(document).on('hide.bs.modal', '#modalPopup', function () {
                alert('');
                //Do stuff here
            });

            //alert($(window.parent.document).find('#modalPopup').modal);

            $(window.parent.document).find('#modalPopup').modal({
                appendTo: $(window.parent.document).find('body'),
                overlayCss: { backgroundColor: "#333" }, // Optional overlay style
                overlayClose: true,
            });
            // Set overlay's width
            $(window.parent.document).find('#simplemodal-overlay').css('width', '100%');
        </script>
    </head>
    <body>
            <button type="button" class="btn" name="btn" id="btn" data-target="#modalPopup"

                    data-toggle="modal" data-backdrop="static" data-keyboard="false" href="./Popup.html">
                Click ME!
            </button>
    </body>
    </html>


Пожалуйста, помогите мне. Любая помощь ощутима. Заранее спасибо.

Что я уже пробовал:

Я перепробовал все, что мог, но безуспешно.

F-ES Sitecore

Является ли родительская страница и страница в iframe одним и тем же сайтом?

Coddddder

да, оба находятся на одном и том же сайте.

0 Ответов