Каков наилучший способ предотвратить перезагрузку страницы с помощью JQuery (ajax)?

Question

Резюме: У меня есть:

1) Главная (main.php) 2) простой .js файл сценария (dashboard.js) 3) один другой простой .php файл (form1.php) 4) process.php, файл, обрабатывающий информацию, отправленную файлом .js (process.php)

Как и tumblr, я пытаюсь воссоздать один и тот же «навигационный» опыт - щелкнув несколько параметров, заменив основную панель с новым кодом и при заполнении какой-либо формы отправьте эту информацию в BD и представите результат в Main.php

Все идет хорошо, но последнее шаг. После нажатия кнопки nav (main.php), приведя новую форму через javascript (dashboard.js + form1.php), заполнив эту форму, я нажимаю кнопку и вместо того, чтобы не перезагружать страницу (jquery-> ajax), он отправляет меня в файл process.php и представляет мне результат.

Я попытался не перезагрузить «return false» и «event.preventdefault()» и все тот же результат.

JS код

 $('form.ajax').on('submit', function() { 
    event.preventDefault(); 
    var that = $(this), 
    url = that.attr('action'), 
    type = that.attr('method'), 
    data = {}; 

    that.find('name').each(function(index, value) { 

     var that = $(this), 
     name = that.attr('name'), 
     value = that.val(); 

     data[name] = value; 

    }); 


    $.ajax({ 
     url: url, 
     type: type, 
     data: data, 
     success: function(html){ 
        event.preventDefault(); 
        $("ol#list-feed").append(html); 
        document.getElementById('set-width1').value=''; 
        document.getElementById('tags').value=''; 

       } 


    }); 
    event.preventDefault(); 
    return false; 
}); 

Answer 1

Вы не определили event:

$('form.ajax').on('submit', function(event) { 
    event.preventDefault(); 
    //... 
}); 

Answer 2

Вы должны изменить первую строку:

$('form.ajax').on('submit', function(event) { 

в противном случае переменной event внутри функции не определено.

Answer 3

попробовать, как этот

$('form.ajax').on('submit', function(event) { 
    event.preventDefault(); 
    //do other works here 

} 

или удалить event.preventDefault() отовсюду и до конца этой функции просто использовать возвращение ложным.

Answer 4

Это должно работать

$('form.ajax').on('submit', function(event) {