javascript - 如何在对象数组中动态添加 id 属性？

Question

我有一个简单的部分，用户可以在其中使用表单添加电影详细信息。我正在获取用户输入的值并从中创建一个对象，然后将其插入数组中。不过，我还想为每个添加的电影添加一个动态 ID。

$("#btnAddMovie").click(function(e) {
  console.log('btn-movie triggered');

  var jsonData = [];
  var formData = $("#movieForm").serializeArray();

  $.each(formData, function() {
    console.log(formData);
    jsonData.push({
      title: formData[0].value,
      movieurl: formData[1].value,
      movieid: '1'
    });
  });

  console.log(jsonData);

  var params = JSON.stringify({
    movies: jsonData
  });

  $.ajax({
    type: 'POST',
    data: {
      params: params
    },
    url: 'save_to_json.php',
    success: function(data) {
      $('#msg').html(data).fadeIn('slow');
      $('#msg').delay(2000).fadeOut('slow');
    },
    error: function() {
      $('#error-msg').html(data).fadeIn('slow');
      $('#error-msg').delay(2000).fadeOut('slow');
    }
  });
});

上面的解决方案给了我这个

{
  "movies": [{
    "title": "fdfdfd",
    "movieurl": "http:\/\/meed.audiencevideo.com\/videos",
    "movieid": "1"
  }, {
    "title": "fdfdfd",
    "movieurl": "http:\/\/meed.audiencevideo.com\/videos",
    "movieid": "1"
  }]
}

我希望 movieid 动态递增，例如 movieid: 1、movieid: 2 等。我需要做什么才能得到我想要的想要吗？

Answer 1

在您的代码中，您可以在 $.each 的回调中使用索引

....
$.each(formData, function(index) {
   console.log(formData);
   jsonData.push({
      title: formData[0].value,
      movieurl: formData[1].value,
      movieid: index + 1
    });
  });
...

要了解回调，请参阅 jquery 文档 https://api.jquery.com/jQuery.each/

<小时/>

或者，您也可以使用jsonData.length

....
$.each(formData, function(index) {
   console.log(formData);
   jsonData.push({
      title: formData[0].value,
      movieurl: formData[1].value,
      movieid: jsonData.length + 1
    });
  });
...