如何使用 $.ajax() jquery 发送多个数据答案

【问题标题】：how to send multiple data with $.ajax() jquery如何使用 $.ajax() jquery 发送多个数据
【发布时间】：2012-04-09 18:46:35
【问题描述】：

我正在尝试使用 j 查询 $.ajax 方法向我的 php 脚本发送多个数据，但是当我连接多个数据时我只能传递单个数据我在我的 php 脚本中遇到未定义的索引错误，这意味着发出了 ajax 请求但是数据未发送我需要知道我应该如何格式化多个数据以连续将其发送到名称 vale 对中的处理脚本这是我所写的

<script>
  $(document).ready(function() {

    $('#add').click(function () {

      var name = $('#add').attr("data_id");

      var id = $('#add').attr("uid");

      var data = 'id='+ id  & 'name='+ name; // this where i add multiple data using  ' & '

      $.ajax({
        type:"GET",
        cache:false,
        url:"welcome.php",
        data:data,    // multiple data sent using ajax
        success: function (html) {

          $('#add').val('data sent sent');
          $('#msg').html(html);
        }
      });
      return false;
    });
  });
</script>



<span>
  <input type="button" class="gray_button" value="send data" id="add" data_id="1234" uid="4567" />
</span>
<span id="msg"></span>

【问题讨论】：

我通常只是将相关项目放在一个对象中（或将它们保留在其原始对象中），将整个对象转换为 JSON 字符串，然后将 JSON 字符串发送到 parm 中。在服务器端，我让 php 将 JSON 字符串转换回一个对象，瞧，我在做生意。

标签： jquery ajax

【解决方案1】：

您可以创建一个键/值对对象，然后 jQuery 将为您完成剩下的工作：

$.ajax({
    ...
    data : { foo : 'bar', bar : 'foo' },
    ...
});

这样数据将自动正确编码。如果您确实想编造自己的字符串，请确保使用encodeURIComponent():https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/encodeURIComponent

您当前的代码无法正常工作，因为字符串未正确编写：

'id='+ id  & 'name='+ name

应该是：

'id='+ encodeURIComponent(id) + '&name='+ encodeURIComponent(name)

【讨论】：

'id='+ id & 'name='+ name 应该改成 'id='+ id+'&name='+ name
@SaeedAnsari 除此之外，使用encodeURIComponent 清理变量是一个非常好的主意，如答案中的示例所示。没有理由不防范 XSS 攻击。

【解决方案2】：

var my_arr = new Array(listingID, site_click, browser, dimension);
    var AjaxURL = 'http://example.com';
    var jsonString = JSON.stringify(my_arr);
    $.ajax({
        type: "POST",
        url: AjaxURL,
        data: {data: jsonString},
        success: function(result) {
            window.console.log('Successful');
        }
    });

这已经为我工作了很长一段时间。

【讨论】：

【解决方案3】：

我建议使用哈希而不是参数字符串：

data = {id: id, name: name}

【讨论】：

【解决方案4】：

如下更改var data = 'id='+ id & 'name='+ name;，

改用这个.....

var data = "id="+ id + "&name=" + name;

这将正常工作:)

【讨论】：

【解决方案5】：

var value1=$("id1").val();
var value2=$("id2").val();
data:"{'data1':'"+value1+"','data2':'"+value2+"'}"

【讨论】：

【解决方案6】：

var data = 'id='+ id  & 'name='+ name;

& 符号也需要被引用：

var data = 'id='+ id  + '&name='+ name;

【讨论】：

+1 因为这是问题的症结所在，尽管我会使用 Jasper 的回答中建议的数据对象。
这行得通，我认为数据中的 &(ampersand) 使代码难以理解 @SKS 给出的解决方案很好
@sohaan：是的，Javascript 对象是更好的解决方案。

【解决方案7】：

你可以使用FormData

看看我在 MVC 中的 sn-p

var fd = new FormData();
fd.append("ProfilePicture", $("#mydropzone")[0].files[0]);// getting value from form feleds 
d.append("id", @(((User) Session["User"]).ID));// getting value from session

$.ajax({
    url: '@Url.Action("ChangeUserPicture", "User")',
    dataType: "json",
    data: fd,//here is your data
    processData: false,
    contentType: false,
    type: 'post',
    success: function(data) {},

【讨论】：

【解决方案8】：

  var value1=$("id1").val();
  var value2=$("id2").val();
    data:"{'data1':'"+value1+"','data2':'"+value2+"'}"

你可以用这种方式传递数据

【讨论】：

【解决方案9】：

var CommentData= "u_id=" + $(this).attr("u_id") + "&post_id=" + $(this).attr("p_id") + "&comment=" + $(this).val();

【讨论】：