javascript - Bootstrap模式提交不传递变量

Question

我有一个简单的模式登录表单。当表单关闭时，我想在单独的 div 中显示电子邮件。问题是 div 中的文本没有改变。我调试了代码，看起来像是当我单步执行文本更改时，但是当它退出提交函数时，它又会变回来。我究竟做错了什么？ tnx!代码如下:

 <div class="container">
    <button class="btn btn-success" data-toggle="modal" data-target="#myModal" id="testButton">Open modal</button>
    <div id="emailTarget">Email ends up here</div>

    <div class="modal" id="myModal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button class="close" data-dismiss="modal">x</button>
                    <h4 class="modal-title">Please type some text</h4>
                </div>

                <div class="modal-body">
                    <form class="form-signin" id="signIn">
                        <h2 class="form-signin-heading">Please sign in</h2>
                        <label for="inputEmail" class="sr-only">Email address</label>
                        <input type="email" id="inputEmail" class="form-control" placeholder="Email address" required autofocus>
                        <label for="inputPassword" class="sr-only">Password</label>
                        <input type="password" id="inputPassword" class="form-control" placeholder="Password" required>
                        <div class="checkbox">
                          <label>
                            <input type="checkbox" value="remember-me"> Remember me
                          </label>
                        </div>
                        <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
                    </form>
                </div>
            </div>
        </div>
    </div>

</div>
<script>
    $("#signIn").submit(function(event) {
       $("#emailTarget").html($("#inputEmail").val());
    });
</script>

Answer 1

如果不想POST，则返回 false:

   $('#myModal').modal('hide');
   return false;

Check example