Jquery AJAX取代了Vanilla js难度

时间:2017-06-22 02:03:47

标签: javascript php jquery ajax

首先,我想描述一下错误。

这是我的Jquery代码,它很好。

 $.ajax({ url: 'ajaxHandler.php',
     data: {'list' : 'list'},
     type: 'post',
     dataType:'json',
     success: function(output) {
                  alert(output);
              },
      error: function(request, status, error){
        alert("Error: Could not delete");
      }
  });

但问题是我只想在香草js中创造相同的东西。

var request = new XMLHttpRequest();
    request.open("POST", url, true);
    //Send the proper header information along with the request
    request.setRequestHeader("Content-type", 'application/json; charset=UTF-8');
    request.onreadystatechange = function() {

      if (request.readyState == 4 && request.status == 200) {
          alert(request.responseText);
      };
    }
    var dataParam = {
        'list': 'list'
    };

    var $json = JSON.stringify(dataParam);
    request.send($json);

有谁能告诉我我的错误在哪里。

    <?php
    require_once 'tasksController.php';
    $dataFunction =  (string)($_POST['list']);
    echo $dataFunction;

    ?>

这是我的提醒: 注意:未定义的索引:第3行的C:\ xampp .......... \ ajaxHandler.php中的列表

1 个答案:

答案 0 :(得分:3)

问题是jQuery不是发送 JSON,它将对象作为www-urlencoded数据发送,并期望得到JSON 返回

var request = new XMLHttpRequest();
var data    = new FormData();

data.append('list','list');

request.onreadystatechange = function() {
  if (request.readyState === 4 && request.status === 200) {
    var result = JSON.parse(request.responseText);
    console.log(result);
  }
}

request.open("POST", 'ajaxHandler.php', true);
request.send(data);