Скрыть div по клику

0 
<div id="result">Fade me in and hide div hideme</div>
<div id="hideme">
    <form method="POST">
        YES <input type="radio" name="name" value="yes" />
        NO <input type="radio" name="name" value="no" checked />
        <p />
        <input type="submit" id="submit" name="submit" value="HIDE NOW!" />
    </form>
</div>
<script>
    $(document).ready(function() {
        $('#result').hide();
        $('#submit').click(function() {
            $('#hideme').hide();
            $('#result').fadeIn(5000);
        });
    });
</script>

Вот jsfiddle

Почему вторая шкура не работает после нажатия и fadeOut div

  • 4
    Потому что вы отправляете форму! Если вам нужна форма, чтобы остаться, вам нужно ajax и предотвратить отправку по умолчанию. Также никогда не вызывайте ничего в форме name = "submit". Также, пожалуйста, используйте jQuery из этого века
  • 0
    Строго говоря, не все ли jQuery из «этого века»? Он был выпущен только в 2006 году, в конце концов ...
Показать ещё 1 комментарий
Теги:

2 ответа

0
Лучший ответ

Вы должны использовать .preventDefault() чтобы предотвратить поведение кнопки submit по умолчанию. Или используйте обычную кнопку (type='button') вместо кнопки отправки.

Пытаться,

$(document).ready(function () {
        $('#result').hide();
        $('#submit').click(function(e) {             
            e.preventDefault();
            $('#hideme').hide();
            $('#result').fadeIn(5000);
        });
    });

DEMO

Поделиться
  • 0
    Не удалось добавить этот код
  • 0
    @ user3104720 Попробуйте мою демонстрацию.
Показать ещё 6 комментариев
-1

Чтобы отправить сообщение вам необходимо AJAX и preventDefault, чтобы не отправлять Также никогда не вызывайте ничего в форме submit

$(function() {
  $('#result').hide();
  $('#form1').on("submit", function(e) {
    e.preventDefault(); // stop form submission
    $('#hideme').hide();
    $.post(this.action, { "name": $("input[name='name']").val()},function(data) {
      $('#result').html(data).fadeIn(5000);
    });
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="result">Fade me in and hide div hideme</div>
<div id="hideme">
  <form id="form1" method="POST" action="someaction.php">
    YES <input type="radio" name="name" value="yes" /> NO <input type="radio" name="name" value="no" checked />
    <p />
    <input type="submit" value="HIDE NOW!" />
  </form>
</div>
Поделиться
  • 0
    Не понятный даунвот

Ещё вопросы

Сообщество Overcoder
Наверх
Меню