event.preventDefault не работает

Question

У меня есть этот простой код, ничего особенного.

    $("input#send").submit(function(event){
      event.preventDefault();
    $.ajax({
        type: 'POST',
        url: add.php,
        data: data,
        success: success,
        dataType: dataType
    });
});

Когда я нажимаю кнопку "отправить", функция event.preventDefault не работает, и страница загружается.

Есть идеи почему?

Answer 1

A форма имеет событие отправки, а не кнопку.Кроме того, идентификатор должен быть уникальным, поэтому tag#id может быть просто #id.

$("#theform").submit(function(event) {
    event.preventDefault();
    // ...
});

Answer 2

Вам необходимо привязаться к событию submit формы или к событию click кнопки и вызвать event.preventDefault(), если вы хотите остановить отправку формы:

$('form').bind('submit', function (event) {
    event.preventDefault();
});

$('form').find(':submit').bind('click', function (event) {
    event.preventDefault();
});

Answer 3

Я считаю, что событие submit для элемента form .Для ввода [type = 'button'] вы можете использовать событие click.

Answer 4

1. Добавьте кавычки вокруг 'add.php'
2. Измените селектор в первой строке на атрибут id формы, которая содержит input#send.

Преимущество обработки обработчика submit() в форме, а не обработчика click на входе, состоит в том, что некоторые формы можно отправить, нажав клавишу ввода (когда пользователь фокусируется наодно из полей формы).Если у вас нет атрибута id, добавьте его или используйте другой селектор jQuery для нацеливания на тег формы.

$("#myform").submit(function(e) {
    e.preventDefault();
    $.ajax({
        type: 'POST',
        url: 'add.php',
        data: data,
        success: success,
        dataType: dataType
    });
    return false;
});

Answer 5

Если оба return false и event.stopPropagation() не работают, попробуйте следующий метод. Использование .on() сделает функцию отправки доступной. После того как вы измените .submit() на .on("submit"..), вы можете использовать return false или e.stopPropagation().

$(document).on("submit", "input#send", function(event) {
    event.stopPropagation();
    $.ajax({
        type: 'POST',
        url: add.php,
        data: data,
        success: success,
        dataType: dataType
    });
    return false; });

Answer 6

Если вы используете protectDefault, я предполагаю, что это означает, что вы НЕ хотите действия по умолчанию для отправки Я бы просто использовал другое событие вместо .submit. Для меня это не действие отправки, которое вы хотите перехватить, а щелчок, который обычно вызывает отправку.

$('#inputSend').on('click', function(event) {
  event.preventDefault();
  //the rest
});

Answer 7

Попробуйте использовать return false вместо

$("input#send").submit(function(event) {
    $.ajax({
        type: 'POST',
        url: add.php,
        data: data,
        success: success,
        dataType: dataType
    });
    return false;
});