如何在不提交表單的情況下使用jquery ajax發送表單數據？

Question

我在我的頁面上有一個表格，我不想提交。這裏是我試圖基本做的一個例子。當我點擊一個按鈕時，我想要發送ajax請求，但不提交表單。這是在點擊我的按鈕時，將運行函數的例子格式：

function clicked() 
{ 
    try { 
      var url = "test.php?t1=1&t2=2" 
      var postData = $("#myForm").serializeArray(); 
      $.ajax(
      { 
       url : url, 
       beforeSend: function (request) 
       { 
        request.setRequestHeader('Content-Type', 'text/html; charset=utf-8'); 
       }, 
       type: "POST", 
       data : postData, 
       contentType: false, 
       processData: false, 
       success:function(data, status, xhr) 
       { 
        if(status == "success") 
        { 
         alert(data); 
         // Do something on page 
        } 
        else 
        { 
         // Do something on page 
        } 
       }, 
      }); 
     } 
    catch (e) 
    { 
     alert("Error Adding POI:\n" + e); 
    } 
} 

當我禁用的形式使用的preventDefault功能提交表單不會提交。然而，表單只是發送一個ajax post請求到我的url「test.php？t1 = 1 & t2 = 2」，沒有我的表單的任何輸入值。如果沒有preventDefault，表單會提交併導航離開頁面。沒有發送ajax請求。有沒有任何方式發送表單數據到URL「test.php？t1 = 1 & t2 = 2」與ajax請求沒有提交表單？

在此先感謝。任何幫助是極大的讚賞。

Answer 1

TRY：當我挖出一些細節你

$('input [type="submit"]').on('click',function(e){ 
    e.preventDefault(); 
    var url = "test.php?t1=1&t2=2" 
       var postData = $('this').serialize(); 
       $.ajax(
       { 
        url : url, 
        beforeSend: function (request) 
        { 
         request.setRequestHeader('Content-Type', 'text/html; charset=utf-8'); 
        }, 
        type: "POST", 
        data : postData, 
        success:function(data, status, xhr) 
        { 
         if(status == "success") 
         { 
          alert(data); 
          // Do something on page 
         } 
         else 
         { 
          // Do something on page 
         } 
        }, 
       }); 

    }) 

Answer 2

以下骯髒的黑客可能工作。還請繼續使用preventDefault來阻止表單提交。

//Change 
var url = "test.php?t1=1&t2=2" 
var postData = $("#myForm").serializeArray(); 

//To 
var url = "test.php" 
var postData = "t1=1&t2=2&" + $("#myForm").serialize();