隐藏表单并在表单提交上显示div

Question

I'm trying to hide the form in div id="first" and show the div id="second" when the submit button is pressed. 我试图隐藏div id="first"的表单，并在按下提交按钮时显示div id="second" 。 Below is the code I'm using, but it isn't working. 下面是我正在使用的代码，但它无法正常工作。 The result is a 'quick' hide of div id="first" and a 'quick' show of div id="second" before the page returns to its original view. 结果是在页面返回其原始视图之前“快速”隐藏div id="first"和“快速”显示div id="second" 。

Can someone please help me correct this? 有人可以帮我纠正一下吗？ Thank you! 谢谢！

 $(document).ready(function() { $("#myform").submit(function(e) { $("#first").hide(); $("#second").show(); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <!doctype html> <div id="first" class="1" style="display:"> <form action="/student/webdesign/2015/4th/04_50/tinker/hideDiv/hide.php" method="post" id="myform"> <p> <label for="textfield">Text Field:</label> <input type="text" name="name" id="name"> <br> <input type=submit formmethod="POST"> </p> </form> </div> <div id="second" class="2" style="display:none"> test </div>

Answer 1

Its probably because the default event is being executed on when the form is being submitted. 这可能是因为在提交表单时正在执行默认事件。 Give this a try. 试一试。

 $(document).ready(function() {
        $("#myform").submit(function(e) {
            e.preventDefault();
            $("#first").hide();
            $("#second").show();
        });
    });

Give this a read as well - https://api.jquery.com/event.preventdefault/ 给这个读一读 - https://api.jquery.com/event.preventdefault/

隐藏表单并在表单提交上显示div

问题描述

1 个解决方案

解决方案1
9 已采纳 2016-01-07 20:59:17

隐藏表单并在表单提交上显示div

问题描述

1 个解决方案

解决方案1 9 已采纳 2016-01-07 20:59:17

解决方案1
9 已采纳 2016-01-07 20:59:17