Question

我不太了解ajax的工作原理，尤其是上面的“数据”。我知道要在url和类型中输入什么内容，但是对于数据我不知道要输入什么内容，什么是AJAX上的数据。

我想通过使用AJAX调用php脚本来使用AJAX提取数据库中的数据。我想获取已满的日期，并在我使用的datepicker插件上将其禁用。

<script type="text/javascript">

       let picker = new Lightpick({
       field: document.getElementById('lightpick-datepicker'),
       minDate: new Date(),
       disableWeekends: true
   });

   let disabledDates = // here ajax request to fetch unavailable dates as array. 
   // for example fetch data has returned that array: 
   // [
   //    ['2019-02-05', '2019-02-11'],
   //    ['2019-02-14', '2019-02-16']
   // ]

   // set to picker unavailable dates
   picker.setDisableDates(disabledDates);

</script>

这是我上面的代码，这是我认为该代码应如何工作的方式或我错了吗？我只是不知道该放在哪里以及AJAX是如何工作的。

如果有人真的解决过这个问题/对我有帮助，您能解释一下调用php脚本ajax的工作方式吗？因为我可能经常在我的项目中使用此“使用AJAX调用php脚本”。

我尝试使用AJAX东西搜索有关此调用php脚本的信息。但是他们对工作原理的解释不佳，尽管给出的代码不能解决我的问题，但他们只给出代码。

尝试过此代码：：

<script type="text/javascript">

       let picker = new Lightpick({
       field: document.getElementById('lightpick-datepicker'),
       minDate: new Date(),
       disableWeekends: true
   });

   let disabledDates = ({
        $.ajax({

            url: '/action/get_dates.php';
            type: 'POST';
            data: {} // i dont know that to put here

        });
   )};

   // set to picker unavailable dates
   picker.setDisableDates(disabledDates);

</script>

Answer 1

我建议使用 fetch（）函数或JQuery的 $。ajax（）。

fetch(`http://${SERVER_IP}:${SERVER_PORT}/${filename}`, {
    method: "GET",
}).then(resp => response.json())
  .then(respBody => picker.setDisableDates(respBody))

让我解释一下：

获取功能的第一个参数是您的php脚本的 url 。假设您的服务器与客户端（浏览器）在同一台计算机上运行，则SERVER_IP ='localhost'。假设您使用的是Apache服务器，则很可能是SERVER_PORT =8080。filename = {yourphpscriptname.php。

第二个参数是 options 参数。您应该提供在AJAX调用中使用的方法（“ GET” |“ POST” |“ PUT” |“ DELETE” | ...）。如果没有提供，那么我猜默认情况下将使用“ GET”。

AJAX调用是异步，也就是说，如果有

var a = 10;
fetch(`http://${SERVER_IP}:${SERVER_PORT}/${filename}`, {
    method: "GET",
}).then(respBody => a++)
//will print '10'
console.log(a);

输出最有可能是10，因为fetch（）之后的第一行代码将在响应来自服务器之前执行。想要在收到响应时执行的代码需要放在 then（）中。

response.json（）从http请求中提取响应正文，并将其从json转换为JavaScript对象。

还要检查 fetch（）函数here的浏览器兼容性。

But they explain poorly on how it works they only give codes though the codes they give doesn't solve my problem.

如果我的回答对您没有帮助，那么您需要更清楚地说明您面临的是什么问题。

Answer 2

嗨，你可以这样：

首先使用ajax：

    var id = 1;

    $.ajax({
        method: "POST",
        url: "../script/script.php",
        data: { action: "SLC", id: id}
      }).done(function(response){
console.log(response);
})

您的php脚本：

 if (isset($_POST["action"])) {
        $action = $_POST["action"];
        switch ($action) {
            case 'SLC':
                if (isset($_POST["id"])) {
                    $id = $_POST["id"];
                    if (is_int($id)) {
                        echo "is an integer";
                    }
                }
                break;

        }
    }

其中action是要执行SLC，UPD，DEL等的命令，而id是一个参数，如果要使用json，请改用echo json_encode（$ data）

希望有帮助

如何使用AJAX调用php脚本

2 个答案: