Предотвращение по умолчанию в форме Отправить jQuery

Что случилось с этим?

HTML:

<form action="http://localhost:8888/bevbros/index.php/test" method="post" accept-charset="utf-8" id="cpa-form" class="forms">        
      <input type="text" name="zip" value="Zip code" id="Zip" class="required valid">      
      <input type="submit" name="Next" value="Submit" class="forms" id="1">
  </form>

JQuery

$("#cpa-form").submit(function(e){
    e.preventDefault();
  });

Ответы

Ответ 1

Попробуйте следующее:

$("#cpa-form").submit(function(e){
    return false;
});

Ответ 2

Используйте новый синтаксис события "on".

$(document).ready(function() {
  $('form').on('submit', function(e){
    // validation code here
    if(!valid) {
      e.preventDefault();
    }
  });
});

Cite: https://api.jquery.com/on/

Ответ 3

Я считаю, что приведенные выше ответы являются правильными, но это не указывает, почему метод submit не работает.

Ну, метод submit не будет работать, если jQuery не сможет получить элемент form, и jQuery не дает никакой ошибки об этом. Если ваш script помещен в начало документа, убедитесь, что код работает после DOM готов. Таким образом, $(document).ready(function () { // your code here // }); решит проблему.

Лучшая практика: всегда помещать script в нижнюю часть документа.

Ответ 4

$('#cpa-form input[name="Next"]').on('click', function(e){
    e.preventDefault();
});

Ответ 5

Это древний вопрос, но принятый здесь ответ на самом деле не доходит до корня проблемы.

Вы можете решить это двумя способами. Сначала с помощью jQuery:

$(document).ready( function() { // Wait until document is fully parsed
  $("#cpa-form").on('submit', function(e){

     e.preventDefault();

  });
}

Или без jQuery:

// Gets a reference to the form element
var form = document.getElementById('cpa-form');

// Adds a listener for the "submit" event.
form.addEventListener('submit', function(e) {

  e.preventDefault();

});

Вам не нужно использовать return false для решения этой проблемы.

Ответ 6

$(document).ready(function(){
    $("#form_id").submit(function(){
        return condition;
    });
});

Ответ 7

Ваш код в порядке, просто нужно разместить его в готовой функции.

$(document).ready( function() {
  $("#cpa-form").submit(function(e){
     e.preventDefault();
  });
}

Ответ 8

DEPRECATED - эта часть устарела, поэтому не используйте ее.

Вы также можете попробовать этот код, если вы, например, позже добавили динамические формы. Например, вы загрузили асинхронное окно ajax и хотите отправить эту форму.

$('#cpa-form').live('submit' ,function(e){
    e.preventDefault();      
    // do something
});

UPDATE - вы должны использовать метод jQuery on(), чтобы попытаться прослушивать документ DOM, если вы хотите обрабатывать динамически добавленный контент.

Случай 1, статическая версия: Если у вас есть только несколько слушателей, и ваша форма для обработки жестко запрограммирована, вы можете слушать прямо на "уровне документа". Я бы не использовал слушателей на уровне документа, но я попытался бы углубиться в дерево обременительности, поскольку это может привести к проблемам с производительностью (зависит от размера вашего сайта и вашего контента).

$('form#formToHandle').on('submit'...

ИЛИ

$('form#formToHandle').submit(function(e) {
    e.preventDefault();      
    // do something
});

Случай 2, динамическая версия: Если вы уже слушаете документ в своем коде, тогда этот способ будет полезен для вас. Это также будет работать для кода, который был добавлен позже через DOM или динамический с AJAX.

$(document).on('submit','form#formToHandle',function(){
   // do something like e.preventDefault(); 
});

ИЛИ

$(document).ready(function() {
    console.log( "Ready, Document loaded!" );

    // all your other code listening to the document to load 

    $("#formToHandle").on("submit", function(){
        // do something           
    })
});

ИЛИ

$(function() { // <- this is shorthand version
   console.log( "Ready, Document loaded!" );

    // all your other code listening to the document to load 

    $("#formToHandle").on("submit", function(){
        // do something           
    })
});

Ответ 9

Здравствуйте, искал решение, чтобы сделать форму Ajax с Диспетчером тегов Google (GTM), возврат false предотвратил завершение и отправил активацию события в режиме реального времени в решении Google Analytics, чтобы изменить возврат false на e. preventDefault(); который работал правильно, следует за кодом:

 $("#Contact-Form").submit(function(e) {
    e.preventDefault();
   ...
});

Ответ 10

e.preventDefault() работает нормально, только если у вас нет проблем с вашими JavaScript, проверьте ваши javascripts, если e.preventDefault() не работает, есть вероятность, что некоторые другие части вашего JS также не работают