javascript - 在 Vanilla javascript中向ajax帖子添加变量

标签 javascript ajax

我在 vanilla javascript 中有 post ajax 请求,一切正常,但我需要向 form_data 添加一个变量,它将被发送到 php。 例如变量 apple = 1 已经在 form_data 中。我需要添加 orange = 2,但我不能在我的 html 表单中添加。我的js代码如下:

function button_publish_ajax(variable){
    var form = document.getElementById("form-buttons");
    var form_data = new FormData(form);
        for ([key,value] of form_data.entries()){
        console.log(key + ': '+value);
        }
    var action = form.getAttribute("action");                   
    var xhr = new XMLHttpRequest();
    xhr.open('POST', action, true);
    xhr.overrideMimeType('text/xml; charset=UTF-8');
    xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
    xhr.onreadystatechange = function (){
    if (xhr.readyState == 4 && xhr.status == 200){
        var result = xhr.responseText;
        console.log("Result:" + result);
    }
    };
    xhr.send(form_data);
   }

总结一下:我想将 orange=1 添加到 form_data。任何人都知道该怎么做? 我的主要目的是添加单击哪个按钮的信息以区分 php 中的 ajax 函数。我的 HTML 代码如下:

 <form method="post" action="cms_offers_button.php" id="form-buttons">
  <input type="hidden" name="offer_list" value="12">
    <input name="PublishListItem" type="button" class="btn btn-info offer-publish" value="Publish" id="publish-12" style="display: none;"/>
    <input name="WithdrawListItem" type="button" class="btn btn-info offer-withdraw" value="Withdraw" id="withdraw-12"/>
    <input name="EditListItem" type="button" class="btn btn-default offer-edit" value="Edit" id="edit-12" />
    <input name="DeleteListItem" type="button" class="btn btn-danger offer-delete" value="Delete" id="delete-12"/>

最佳答案

使用 添加它 append() 功能如:

//form_data.append(name, value);

form_data.append('orange',2);

希望这对您有所帮助。

关于javascript - 在 Vanilla javascript中向ajax帖子添加变量,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46894107/

相关文章:

javascript - 如何在文档的 <body> 中搜索

javascript - JQuery、Bootstrap navs - 如何添加上一个/下一个按钮?

javascript - foreach - 显示数据的正确行和列

javascript - 在 jQuery 中解析 JSON 对象

javascript - 提供反馈以从 Controller 查看

javascript - 使用 XMLhttprequest 从函数返回值

javascript - 确定 observable 在 computed 中是否发生了变化

javascript - 如何根据屏幕尺寸更改 Angular JS 中的弹出框位置?

javascript - Ember 应用程序和谷歌爬虫

jquery - XMLHttpRequest 无法加载 请求的资源上不存在 'Access-Control-Allow-Origin' header 。 AWS S3、Retina.JS