Question

我有一个要求输入的索引页面。单击提交按钮后，输入将在另一个.php文件中处理（进程包括使用imagecreatefromjpeg和mysql查询）。现在，它需要再次重定向到索引，并显示一个模式弹出窗口说谢谢。我可以使用以下代码重新定向到索引页面：

    if (!empty($name) && !empty($email) && !empty($office_id) && !empty($title) && !empty($story)) {

        $save_sql = "INSERT INTO `tbl_amadeuscontest` (filename, name, email, office_id, title, story, time) VALUES ('$img_newname','$name','$email','$office_id','$title','$story','$sql_date')";

        $query = mysql_query($save_sql,$con) or die(mysql_error("Could not write information to the database")); 

        if (mysql_affected_rows($con) !== 0) {              
                    header('Location: ' . $uploadForm);

                } 

        mysqli_close($con);
    }

基本上，正是header('Location: ' . $uploadForm);完成了这项工作。但我如何覆盖一个模态弹出窗口同时表示感谢你呢？我需要打电话给js。 finction？还是我需要回应HTML？我需要在哪里放置代码？感谢。

我在这里有一些用于模态弹出的HTML代码： HTML `

                <div class="modal-inner">
                        <img src="http://mysite.com/modal/images/thanku-post.jpg" />
                </div>

                <!-- Use Hash-Bang to maintain scroll position when closing modal -->
                <a href="#!" class="modal-close" title="Close this modal"
                        data-dismiss="modal">&times;</a>
            </section>
<script src="js/modal.js"></script>`

编辑1 modal.js

`（function（global）{ '使用严格'; //存储变量 var modal = {}; //存储当前活动元素 modal.lastActive = undefined; modal.activeElement = undefined; //为IE8 polyfill addEventListener（只是非常基本的） modal._addEventListener = function（element，event，callback）{ if（element.addEventListener）{ element.addEventListener（event，callback，false）; } else { element.attachEvent（'on'+ event，callback）; } }; //按ESC时隐藏叠加 modal._addEventListener（document，'keyup'，function（event）{ var hash = window.location.hash.replace（'＃'，''）;

    // If hash is not set
    if (hash === '' || hash === '!') {
        return;
    }

    // If key ESC is pressed
    if (event.keyCode === 27) {
        window.location.hash = '!';

        if (modal.lastActive) {
            return false;
        }

        // Unfocus
        modal.removeFocus();
    }
}, false);

// Convenience function to trigger event
modal._dispatchEvent = function (event, modal) {
    var eventTigger;

    if (!document.createEvent) {
        return;
    }

    eventTigger = document.createEvent('Event');

    eventTigger.initEvent(event, true, true);
    eventTigger.customData = { 'modal': modal };

    document.dispatchEvent(eventTigger);
};


// When showing overlay, prevent background from scrolling
modal.mainHandler = function () {
    var hash = window.location.hash.replace('#', '');
    var modalElement = document.getElementById(hash);
    var htmlClasses = document.documentElement.className;
    var modalChild;
    var oldModal;

    // If the hash element exists
    if (modalElement) {

        // Get first element in selected element
        modalChild = modalElement.children[0];

        // When we deal with a modal and body-class `has-overlay` is not set
        if (modalChild && modalChild.className.match(/modal-inner/)) {
            if (!htmlClasses.match(/has-overlay/)) {

                // Set an html class to prevent scrolling
                document.documentElement.className += ' has-overlay';
            }

            // Unmark previous active element
            if (modal.activeElement) {
                oldModal = modal.activeElement;
                oldModal.className = oldModal.className.replace(' is-active', '');
            }
            // Mark modal as active
            modalElement.className += ' is-active';
            modal.activeElement = modalElement;

            // Set the focus to the modal
            modal.setFocus(hash);

            // Fire an event
            modal._dispatchEvent('cssmodal:show', modal.activeElement);
        }
    } else {
        document.documentElement.className =
                htmlClasses.replace(' has-overlay', '');

        // If activeElement is already defined, delete it
        if (modal.activeElement) {
            modal.activeElement.className =
                    modal.activeElement.className.replace(' is-active', '');

            // Fire an event
            modal._dispatchEvent('cssmodal:hide', modal.activeElement);

            // Reset active element
            modal.activeElement = null;

            // Unfocus
            modal.removeFocus();
        }
    }
};

modal._addEventListener(window, 'hashchange', modal.mainHandler);
modal._addEventListener(window, 'load', modal.mainHandler);
modal.setFocus = function () {
    if (modal.activeElement) {

        // Set element with last focus
        modal.lastActive = document.activeElement;

        // New focussing
        modal.activeElement.focus();
    }
};

// Unfocus
modal.removeFocus = function () {
    if (modal.lastActive) {
        modal.lastActive.focus();
    }
};

// Export CSSModal into global space
global.CSSModal = modal;

}(window));`

请注意$uploadForm表示$uploadForm = 'http://' . $_SERVER['HTTP_HOST'] . $directory_self . 'index.php'; 提前感谢您的回答。希望你能帮我解决一下。

Answer 1

您只需将?openModal=1变量传递到索引页即可。在您的视图文件中，编写一个显示模态的条件。我不知道你的模态是如何工作的，但要么只是让css出现，要么运行你的js脚本，从那里切换它。

你的重定向php文件中的

 header('Location: ' . $uploadForm . '?modal=1');

你的HTML中的

<?php if($_GET['modal'] == 1){ ?>
 do something to make your modal appear
<?php } ?>

Answer 2

快速而肮脏的回答。修改你的other.php文件，做这样的事情：

header('Location:' . $uploadForm . '?thanks=1');

然后在index.php的底部，靠近body标签关闭的位置，执行以下操作：

<?php if (isset($_GET['thanks']) && 1 == $_GET['thanks']) { ?>
<script type='text/javascript'>
alert('Thanks!');
</script>
<?php } ?>
</body> <!-- end of body -->

您可以在该脚本标记内执行任何您想要的Javascript。

这里的想法很简单：当你的 index.php 在查询中被赋予thanks=1时，它会显示模态弹出窗口。您设计的其他.php是您唯一期望thanks=1的时间。

如何重定向回索引页面并显示模式弹出按重定向？ PHP

2 个答案: