javascript - 将文本区域中的字符串转换为请求 header

Question

我尝试制作一个表单来提交请求并将结果发布在页面中。我有请求正文、网址和 header 的输入。但我对标题有疑问。我不知道如何转换字符串:

Content-Type : application/x-www-form-urlencoded

至

{"Content-Type" : "application/x-www-form-urlencoded"}

动态地。在我的文本区域中，我可能有 3-4 个听者用逗号分隔，那么如何将这些 header 转换为该函数可接受的结构:

function makePostRequest(url, data, headers, httpVerb, dataType, elementId){
    alert(headers);
    $.ajax({
    url: url,
    type: httpVerb,
    data: data,
    headers: {headers},
    dataType: dataType,
    success: function (data, textStatus, jqXHR) {
      $("#div").val(jqXHR.responseText);
    },
    error: function( jqXHR, textStatus, errorThrown ) { $("#div").val(jqXHR.responseText); }
    });
}

我的 textarea 元素可能包含如下标题:

header1 : content1, header2 : content2

Answer 1

在这里，基本上它是 split() 和 trim() 的组合。这是一个例子:

$(function () {
  $('button').on('click', function (e) {
    var headers = {}
    var values = $('#foo').val()
    
    // split the headers by comma
    var parts = values.split(',')
    
    // iterate over each group
    $.each(parts, function () {
      // split by : and trim additional whitespace
      var innerParts = this.split(':').map(function (item) {
        return item.trim()
      })
      
      // add the given results to the headers object
      headers[innerParts[0]] = innerParts[1]
    })
    
    console.log(headers)
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<textarea id="foo" rows="5" cols="50"></textarea>
<br>
<button>click me</button>