0

入力を求めるインデックスページがあります。送信ボタンがクリックされた後、入力は別の .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を呼び出す必要がありますか。機能？それとも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) { 'use strict'; // ストレージ変数 var modal = {}; // 現在アクティブな要素を格納 modal.lastActive = undefined; modal.activeElement = undefined; // IE8 のポリフィル addEventListener (非常にbasic) 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';あなたがそれを整理するのを手伝ってくれることを願っています.

4

2 に答える 2

0

?openModal=1インデックス ページに変数を渡すだけです。ビュー ファイルに、モーダルを表示する条件を記述します。モーダルがどのように機能しているかはわかりませんが、css を表示するか、そこから切り替える js スクリプトを実行してください。

リダイレクトphpファイルで

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

あなたのhtmlで

<?php if($_GET['modal'] == 1){ ?>
 do something to make your modal appear
<?php } ?>
于 2013-11-02T01:59:06.483 に答える
0

迅速で汚い答え。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。

于 2013-11-02T01:59:29.493 に答える