2016-01-07 2 views
2

Я пытаюсь скрыть форму в div id="first" и показать div id="second" при нажатии кнопки отправки. Ниже приведен код, который я использую, но он не работает. Результатом является «быстрая» скрыть div id="first" и «быстрое» показ div id="second", прежде чем страница вернется к исходному виду.Скрыть форму и показать div на форму submit

Может кто-нибудь, пожалуйста, помогите мне исправить это? Спасибо!

$(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>

+0

, потому что форма представляет и перезагружает страницу. Вы хотите, чтобы форма фактически была отправлена? Если нет, отмените действие по умолчанию. Если вы это сделаете, вам понадобится серверный сервер, чтобы установить состояние элементов. – epascarello

ответ

6

Его, вероятно, потому, что событие по умолчанию выполняется, когда форма представляется. Попробуй.

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

Дайте это прочитать, а также - https://api.jquery.com/event.preventdefault/

+0

Спасибо! 'e.preventDefault();' работал отлично. –

Смежные вопросы