Как я могу остановить форму при перезагрузке с помощью Javascript?

Когда пользователь отправляет форму, я хочу остановить поведение формы по умолчанию. т.е. он не должен перезаряжаться. так что я могу выполнить запрос AJAX.

вот код, который я использовал.

<script type="text/javascript">
    function validateForm()
    {
        return false;
    }
</script>
<form action="" name="contact" onsubmit="validateForm();">
    <input type="text" name="name" value="Enter Your Name..."/>
    <input type="submit" name="submit"/>
</form>

это не останавливает отправку или перезагрузку формы. как мне это достичь?

Ответы

Ответ 1

Он должен быть onsubmit="return validateForm()"

Ответ 2

Вы можете использовать атрибут onsubmit, как предлагается, более ненавязчивым способом является использование preventDefault() объекта события, переданного функции, связанной с вашим событием onsubmit:

function validateForm(e) {
    if (e.preventDefault) {
       e.preventDefault();
    }
    e.returnValue = false; // for IE
}

Это работает, только если вы привязываете прослушиватель событий к форме, а не onsubmit inline.

Изменить: вот как вы могли привязать прослушиватель событий к форме, которая при запуске передаст объект Event (обратите внимание, что это стиль W3C, это не будет работать в IE, но даст вам представление):

var form = document.getElementById('myform');
form.addEventListener('submit', validateForm, false);

Когда событие submit запускается, он вызывает функцию validateForm, передавая объект события. Вот действительно хорошая статья о событиях Javascript:

http://www.quirksmode.org/js/introevents.html

Ответ 3

Вы должны использовать возврат в onsubmit hanlder формы. Попробуйте эту версию:

<script type="text/javascript">
    function validateForm()
    {
        return false;
    }
</script>
<form action="" name="contact" onsubmit="return validateForm();">
    <input type="text" name="name" value="Enter Your Name..."/>
    <input type="submit" name="submit"/>

Ответ 4

добавьте возврат в обработчик событий:

onsubmit="return validateForm();"

В противном случае функция выполняется, но не сообщает браузеру о прекращении обработки.

Ответ 5

Использование jQuery:

$('form').on('submit', function() {
  // call functions to handle form
  return false;
});

В основном то же самое, что и выше, но я предпочитаю, чтобы мой JS вышел из моего HTML, даже атрибута "onsubmit".