Остановить отправку, обновление или открытие нового окна формы HTML5 на веб-сайте

Question

Я использую тег формы HTML5 для встроенного в него средства проверки на стороне клиента, но я не хочу, чтобы он отправлял данные, поскольку вместо этого у меня есть функция Javascript.

Как я могу остановить Post метод формы.

Приветствия - Caius

Answer 1

добавьте возврат false после вызова функции, например, так:

<input .... onclick="function();return false;" />

, или вы можете просто вернуть true / false из функции следующим образом:

<input .... onclick="return function()" />

Answer 2

Я предпочитаю оставить свои функции такими, какие они есть, и добавить возвращаемый false в обработчик onsubmit, например:

<form onsubmit="aFunction(); return false;">

Answer 3

Если вы используете jQuery, вы можете сделать:

$('#your_form_id').submit(function(e){
   e.preventDefault(); 
  // do your staff
});

Вы также можете сделать это без фреймворка:

document.getElementById('your_form_id').addEventListener('submit' function() {
  // do your staff
  return false;
});

В «// do your staff» вы можете написатьВаш код AJAX.

Answer 4

Я испробовал все ваши решения, но все равно перезагрузил страницу после процесса ajax:

<form id="form2" method="POST" onsubmit='sent(); return false;' >

function sent(){
    $.ajax({
        ...
    });
}

Answer 5

Добавьте обработчик onsubmit к вашей форме, например,

<form method="POST" onsubmit="return sendForm();">

Затем определите функцию и добавьте false в качестве возвращаемого значения:

function sendForm() {
    //do your ajax request...
    return false;
}

Answer 6

Добавьте свойство onsubmit к тегу формы:

<form onsubmit="return myfunction()">

убедитесь, что вы возвращаете bool для своей функции

function myfunction() {
  // do your validation
  if (validation.passes)  { // you will need to change this line !!!
     return true; // to submit
  } else {
     return false; // to prevent submit
  }
}