单击带有getElementById的表单提交后,将显示弹出窗口

时间:2015-06-16 04:34:43

标签: javascript php jquery html css

我使用像这样的JavaScript onclick事件点击链接后成功创建了一个要显示的弹出窗口:

<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">Sign In</a>

然而,我现在正试图弄清楚如何使用一个需要存在的链接来工作。我希望它在提交php表单时工作。所以基本上当有人注册时我想在帐户成功注册后出现一个弹出窗口。

我希望得到元素&#39; light&#39;提交表单时。我怎么能这样做?

编辑:

我现在如何尝试这样做..

<form action="" method="POST">
                        <div class="field">
                            <label for="fullname">Full Name</label>
                            <input type="text"  class="inputbar" name="fullname" value="<?php echo escape(Input::get('fullname')); ?>" required>
                        </div>
                        <div class="field">
                            <label for="email">Email</label>
                            <input type="email" class="inputbaremail" name="email" value="<?php echo escape(Input::get('email')); ?>" required>
                        </div>
                        <div class="field">
                            <label for="username">Username</label>
                            <input type="text" class="inputbar" name="username" value="<?php echo escape(Input::get('username')); ?>" autocomplete="off" required>
                        </div>
                        <div class="field">
                            <label for="password">Choose a password</label>
                            <input type="password" name="password" class="inputbarp" required>
                        </div>
                        <div class="field">
                            <label for="password_again">Confirm password</label>
                            <input type="password" name="password_again" class="inputbarp" required>
                        </div>


                        <input type="hidden" name="token" value="<?php echo Token::generate(); ?>">
                        <label for="signinButton">
                        <input id="signinButton" type="submit" value="Register">
                        </label><br>
                    <onsubmit = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">

                    <div id="light" class="signInpopup"><a class="close" href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='none';document.getElementById('fade').style.display='none'">Close</a>
                        <?php $success;?>
                    </div>  

1 个答案:

答案 0 :(得分:0)

正如我在评论中写的那样,将表单发送到带有哈希的URL,例如#sent。如果存在哈希,请显示#light#fade

<style>
    div {display: none}
</style>

<form action="#sent" method=post>
    ...
    <input type=submit>
</form>

<div id="light">light</div>
<div id="fade">fade</div>

<script>
    if (location.hash && location.hash == '#sent') {
        document.getElementById('light').style.display = 'block';
        document.getElementById('fade').style.display = 'block'
    }
</script>

http://jsfiddle.net/2ewsausg/