如何在jQuery ajax post中傳遞動態數據量

Question

$.ajax({
  url: '<?=parseLink("modules/Contacts/output/output.php")?>',
  data: { 
    $('.contacts-block-input-text').each(function(){
      id: $(this).attr('id'),
      value: $(this).val()
    })
  },
  type: 'post',
  success: function(result){
    $('.resultMessage').text(result)
  }
})

所以會有動態數量的輸入字段，我需要收集所有的contacts-block-input-text值並以某種方式將它們傳遞到data字段中。 我怎么能這樣做？ 給定的例子不起作用。

Answer 1

您必須構建一個數組，收集您的輸入數據：

var myData = [];
$('.contacts-block-input-text').each(function(){
  myData.push({
      id: $(this).attr('id'),
      value: $(this).val()
  });
});

然后你可以使用myData將它傳遞給 ajax 調用。

$.ajax({
  url: '<?=parseLink("modules/Contacts/output/output.php")?>',
  data: myData,
  type: 'post',
  success: function(result){
    $('.resultMessage').text(result)
  }
});

Answer 2

您可以簡單地遍歷您的 jQuery 數組，組合數據對象，然后將其傳遞給 AJAX 調用：

var d = [];
$(".contacts-block-input-text").each(function() {
    d.push({ id: this.id, value: this.value });
});    

$.ajax({
    data: d
// ...

Answer 3

您還可以使用$.map()生成數據對象並將其傳遞給ajax方法，如下所示。

var myData = $('.contacts-block-input-text').map(function() {
    return { 'id': this.id, 'value': this.value };
}).get();

$.ajax({
    url: '....',
    data: myData,
    //and so on... 
});