使用jQuery POST方法發送表單

Question

我正在為網站ROBLOX上的用戶制作一個chrome擴展程序，以允許用戶搜索該擴展程序中的項目，然后通過該擴展程序購買它們。 在此站點上購買商品的格式是，您可以在新標簽頁中請求一個類似於“ http://m.roblox.com/Catalog/VerifyTransfer?userAssetOptionId=1641474&expectedPrice=500 ”的頁面，然后點擊buy按鈕。 id不必為了使用戶不得不單擊“購買”按鈕而打開新標簽，而是希望能夠發送帶有表單的POST請求以購買商品（從而避免了必須打開新標簽） 。

我面臨的問題是我真的不知道如何通過POST請求發送信息或發送什么信息。 我覺得__RequestVerificationToken輸入值是要發送的內容，但我不確定。

由於您需要一個帳戶來查看上面的VerifyTransfer頁面，因此這是VerifyTransfer面上表單的html：

<form action="/Catalog/ProcessTransfer" method="post">
<div class="ui-block-a">
    <input name="__RequestVerificationToken" type="hidden" value="xMOEGwHMBW8FKJNOMcb7aG1PgIYgmHFYf3WpXXu3deDCNoL_jMwy0odXkz65pNSPkvRAfrmBH6i8vpJb33q9bs2aM2ybu0fDOMeFJJX3bs-NXaut9SmFBRK360tPQ6JBXLQFYxnqQVskNJevP0ukZQVY1no1">
    <input data-val="true" data-val-number="The field CurrencyType must be a number." data-val-required="The CurrencyType field is required." id="CurrencyType" name="CurrencyType" type="hidden" value="1">
    <input data-val="true" data-val-number="The field AssetID must be a number." data-val-required="The AssetID field is required." id="AssetID" name="AssetID" type="hidden" value="0">
    <input data-val="true" data-val-number="The field UserAssetOptionID must be a number." data-val-required="The UserAssetOptionID field is required." id="UserAssetOptionID" name="UserAssetOptionID" type="hidden" value="1641474">
    <input data-val="true" data-val-number="The field ExpectedPrice must be a number." data-val-required="The ExpectedPrice field is required." id="ExpectedPrice" name="ExpectedPrice" type="hidden" value="500">
    <input type="submit" value="Buy Now" data-theme="d">
</div>
</form>

一個有關如何發送請求的示例將不勝感激！

編輯-

這是我正在嘗試（似乎不起作用）：

$.ajax({
  type: "POST",
  url: "http://m.roblox.com/Catalog/ProcessTransfer",
  data: //the value held in '__RequestVerificationToken'
});

Answer 1

重命名您的表單<form name="form"> ，然后添加以下功能：

$('form[name="form"]').on('submit', function() {

    var formData = $(this).serializeArray();

    $.post({
                url: "http://m.roblox.com/Catalog/ProcessTransfer",
                data: formData

    }).success( console.log('data has been sent')

      .error( console.log('there was an error');
});

這應該可以解決問題。

Answer 2

嘗試這個

$('input#submitButton').click( function() {
    $.ajax({
        url: 'some-url',
        type: 'post',
        dataType: 'json',
        data: datatopass,
        success: function(data) {
                   alert(data); //... do something with the data...
                 }
    });
});

Answer 3

您必須捕獲表單上的事件Submit（），然后使用Ajax發布數據，並在發送數據以取消事件后，表單仍將提交：

$('form[name="form"]').submit(function( event ) {
    // Post the data using Ajax
    $.ajax({
        url: 'some-url',
        type: 'post',
        dataType: 'json',
        data: datatopass,
        success: function(data) {
                   alert(data); //... do something with the data...
                 }
    });
    // Prevent the defautl submit
    event.preventDefault();
});