-1

подскажите есть 2 кнопки

 <form method="POST">
    <input type="submit" name="nazvanie_knopki" value="Нажмите" />
    <input type="submit" name="nazvanie_knopki2" value="Нажмите" />
 </form>

и разный контент для сайта на php

if( isset( $_POST['nazvanie_knopki'] ) ) { echo '1';} 
elseif ( isset( $_POST['nazvanie_knopki2'] )) {echo '2';}

Но при нажатии на кнопки в форме идет перезагрузка страницы . Как сделать без перезагрузки ??

Заранее благодарен!

1

2 ответа 2

3

Мы-то покажем, но будет лучше если ты научишься пользоваться поиском.

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
  </head>
    <body>

      <input class="ajax-form" type="submit" name="nazvanie_knopki" value="Нажмите" />
      <input class="ajax-form" type="submit" name="nazvanie_knopki2" value="Нажмите" />
      <input class="ajax-form" type="submit" name="nazvanie_knopki3" value="Нажмите" />
      <div id="ajax-content">0</div>

      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <script type="text/javascript">
      $(".ajax-form").click(function(e) {
        var form = {};
        form[$(this).attr('name')] = 1;
        $.ajax({
          url: '/ajax.php',
          type: "POST",
          data: $.param(form),
          success: function(data) {
          $('#ajax-content').html(data);
          }
        });
          return false;
          // e.preventDefault(); - либо так
      });
      </script>
    </body>
</html>

Собсна сам ajax.php:

<?php

if (isset($_POST['nazvanie_knopki'])) {
    echo '1';
} elseif (isset($_POST['nazvanie_knopki2'])) {
    echo '2';
} else {
    echo '3';
}
1

Используй e.preventDefault()

jQuery

$('form').on('submit', (e) => {
    e.preventDefault(); //то, что тебе нужно. Это прерывает стандартное действие браузера
    // ...код
});
1
  • Хватит и просто return false в данном случае.
    – And
    19 авг 2018 в 21:56

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.