用ajax提交表單而不重新加載頁面？

我有一個問題，無論我做什麼使用JQuery和Ajax提交表單，但它仍然將我重定向到表單的操作頁面，我不明白，如果外面的事情影響功能或發生什麼。這是我的代碼：用ajax提交表單而不重新加載頁面？

<form action="add-niveau" method="POST" class="ajax"> 
    <div> 
    <input type="text" name="name" placeholder="Your name"> 
    </div> 
    <div> 
    <input type="text" name="email" placeholder="Your email"> 
    </div> 
    <div> 
    <textarea rows="4" cols="20" name="comment"></textarea> 
    </div> 
    <input type="submit" value="send"> 
</form> 
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.12.4.min.js">  </script> 
<script> 
    $('form.ajax').on('submit', function() { 
    return false; 
    }); 
</script>

其他Ajax腳本：

var ajaxRequest; 

function ajaxFunction() { 
try { 

    // Opera 8.0+, Firefox, Safari 
    ajaxRequest = new XMLHttpRequest(); 
} catch (e) { 

    // Internet Explorer Browsers 
    try { 
     ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP"); 
    } catch (e) { 

     try { 
      ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); 
     } catch (e) { 

      // Something went wrong 
      alert("Your browser broke!"); 
      return false; 
     } 
    } 
} 
} 

function getForm(objButton) { 
ajaxFunction(); 
ajaxRequest.onreadystatechange = function() { 
    if (ajaxRequest.readyState == 4) { 
     document.getElementById("formTag").innerHTML = ajaxRequest.responseText; 
    } 
} 
var buttonValue = objButton.value; 
ajaxRequest.open("get", "get-form/" + buttonValue, true); 
ajaxRequest.send(null); 
} 

// Send form using ajax: 
$('form.ajax').on('submit', function(e) { 
    e.preventDefault(); 
});

來源

2017-04-02 Abderrazzak Benbouya

將事件傳遞給您的函數並使用'event.preventDefault'。 – Roljhon

打開控制檯，檢查錯誤。確保你包含jquery。 –

你可以發佈你使用ajax的代碼 – Akashii

您需要添加event.preventDefault（）;因爲你想阻止默認的表單提交，因此在點擊事件之後。

$('form.ajax').on('submit', function(event) { // pass the event to function 

    event.preventDefault(); // add this line 

    $.ajax({ 
     url: "test.php", 
     context: document.body 
    }).done(function() { 
     alert('Done!'); 
    }); 

});

來源

2017-04-02 12:29:41 Yolo

我使用ajax將表單上傳到我的網站的問題，在這一點上，我得到了上述問題，但是當我在其他頁面單獨測試窗體和函數時，它工作正常，所以還有其他影響功能！ –

用ajax提交表單而不重新加載頁面？

回答

相關問題