Question

  'recipient.firstName': 'Fred',
  'recipient.lastName': 'Johnson'

是否有任何优雅的方式将其变为：

var recipient = {
  firstName: 'Fred',
  lastName: 'Johnson
}

在前端使用JS？我想发布JSON，但似乎并不是很容易用HTML完成，因此我想用jQuery拦截POST并将其格式化为我想要的JSON。

编辑：为了清楚起见，我将离开上面的原始问题，但如果你仔细阅读，你会发现我遇到的问题不是将数据与AJAX一起发布到REST API。这很简单，已经实施了。发生的事情是我使用我创建的模板引擎动态构建表单，并构建表单id和名称来表示嵌套数据，例如recipient.firstName。但是，当我收到以JSON格式传递给API端点的数据时，我需要以编程方式将其从第一种格式转换为第二种格式，这就是问题实际上是在询问您是否仔细阅读。很抱歉有任何困惑，我在下面列出的答案解决了这个问题。

Answer 1

var recipient = [{firstName: "Fred",lastName: "Johnson"}]
                //:: CONVERT TO JSON
                recipient = JSON.stringify(recipient);
                //:: POST THE DATA 
                $.post(LINK_url,{post_recipient : recipient },json/*:: json not important, it can be auto guessed. delete ',json' */,function(output){
                    //var data =jQuery.parseJSON(output);});

______________________________编辑_______________________________________

如果我这次你说得对，你的输出是计划文本，你需要转换为json，如果是这样的话。试试这个。

var recip = JSON.stringify[{ output }];
var data = jQuery.parseJSON(recip);
var viewdata='';
$.each(data, function(key, recipient){viewdata +=
recipient.firstName +" "+recipient.lastName+"<br/>"
})
prompt(viewdata);

Answer 2

使用serializeArray()和forEach以及其他对象使用带有表单的jQuery：

＆＃13;

$(function() {
  var recipient = $("#frm").serializeArray();
  var output = {}; // Declare an object.

  recipient.forEach(function(v, i) {
    output[v.name] = v.value; // Assign the current value to the current key.
  });

  $.ajax({
    url: "http://httpbin.org/post",
    type: "POST",
    data: JSON.stringify(output), // Send the object.
    contentType: "application/json",
    success: function(response) {
      //console.log(response);
    }
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<form id="frm" method="post">
  firstName:
  <br/>
  <input id="firstName" name="firstName" type="text" value="Fred" />
  <br />lastName:
  <br/>
  <input id="lastName" name="lastName" type="text" value="Johnson" />
  <br />age:
  <br/>
  <input id="age" name="age" type="text" value="30" />
</form>

＆＃13;

在请求中，您发送：

Answer 3

<强>更新

现在我知道你的服务器端是NodeJs，你只需要学习如何调用NodeJS服务器端方法：

How to send data from JQuery AJAX request to Node.js server

所以你的方法是错误的，你有这个不必要的复杂数据串，你想拦截。不要拦截任何东西，从一开始就使用jQuery或Javascript向服务器控制器或API发送格式良好的HTTP POST。您的API方法的签名应为：

DoSomethingWithRecipient(string firstName, string lastName);

您的收件人也应该有userId，但这取决于您。如果您没有使用可以解析传入请求的服务器端框架并将其映射到您的DoSomethingWithRecipient函数（如PHP或ASP.NET），那么您最有可能无缘无故地重新发明轮子。

与jQuery相比，您只需像以下那样执行Ajax HTTP Post：

var recipient = {
  firstName: 'Fred',
  lastName: 'Johnson'
}

var json = JSON.stringify(recipient);

$.ajax({
    url: '/MyUrl/DoSomethingWithRecipient',
    type: 'POST',
    dataType: 'json',
    data: json,
    contentType: 'application/json; charset=utf-8',
    success: function (data) {
    },
    error: function (result) {
    }
});

Answer 4

这就是我正在使用的：

_.forOwn(options, function(value, key) {
  if(key.indexOf('.') != -1){

    var split = key.split('.')

    if( !global[split[0]] ) {
      global[split[0]] = {}
    }

    global[split[0]][split[1]] = value
  }
});

使用global，因为我在后端使用NodeJS。

到目前为止似乎工作，我会报告我是否最终使用它。

如何将HTML POST数据转换为JSON？

4 个答案: