Jquery-ajax并没有成功

时间:2017-11-22 15:23:00

标签: javascript jquery ajax

我对ajax很新,只是学习它,并在localhost上创建了一个简单的页面来测试来自/到同一文件夹中的json文件的获取和发布。

虽然GET工作顺利,我无法弄清楚,如果我点击我分配此功能的按钮,为什么不发生帖子。 请看看我的代码和帮助。

element = $("#mylist");
var item2 = $("#mytable");

$.ajax({
  type: "GET",
  url: "data.json",
  success: function(response) {
    $.each(response, function(i, item) {
      element.append("<li>" + item.fname + " " + item.lname + "</li>");
      item2.append("<tr><td>" + item.lname + "</td>" + "<td>" + item.fname + "</td></tr>");
    });
  },
  error: function() {
    alert("error");
  }
});

$("#additem").on('click', function() {
  var $fname = $("#fname");
  var $lname = $("#lname");
  var $city = $("#city");
  var order = {
    fname: $fname.val(),
    lname: $lname.val(),
    city: $city.val()
  };
  console.log(order);

  $.ajax({
    type: "POST",
    url: "data.json",
    data: order,
    succes: function() {
      console.log("succes");
    },
    error: function() {
      console.log("no success");
    }
  });
});

JSFiddle

1 个答案:

答案 0 :(得分:1)

问题是你试图发布到.json文件,就像Patrick Evans在评论中所说的那样。您需要对脚本执行发布操作,在PHP中您可以执行以下操作:

$order = $_POST['order'];
// Do something with order...
echo $order; // or echo success message

当然,要使用它,您需要在服务器上运行PHP(localhost)。