Javascript 通过.js文件获取mysql数据

我会直截了当地说。我需要知道是否可以强制

.js

文件读取

php

语法。如果是这样的话，你们有谁能教我这一点吗？我的项目主要是解析数据库中的数据，这些数据最终将显示为图形。有了这个，我就用ff。代码：

data.js

 var ganttData = [
    {
        id: 1, name: "Site Identification", series: [
            { name: "Planned", start: new Date(2018,03,01), end: new Date(2018,03,20) },
            { name: "Actual", start: new Date(2018,03,01), end: new Date(2018,03,15), color: "#ff0000" }
        ]
    }, 
    {
        id: 2, name: "Site Evaluation", series: [
            { name: "Planned", start: new Date(2018,04,20), end: new Date(2018,05,10) },
            { name: "Actual", start: new Date(2018,04,21), end: new Date(2018,05,05), color: "#00ff00" },
            //{ name: "Projected", start: new Date(2018,00,06), end: new Date(2018,00,17), color: "#e0e0e0" }
        ]
    }, 
    {
        id: 3, name: "Approval of MOA with Farmer...", series: [
            { name: "Planned", start: new Date(2018,05,11), end: new Date(2018,05,20) },
            { name: "Actual", start: new Date(2018,05,11), end: new Date(2018,05,21), color: "#ffff00" }
        ]
    }, 
    {
        id: 4, name: "Sourcing/Procurement of Planting Material", series: [
            { name: "Planned", start: new Date(2018,05,20), end: new Date(2018,07,18) },
            { name: "Actual", start: new Date(2018,05,20), end: new Date(2018,07,05), color: "#00ff00" }
        ]
    },
    {
        id: 5, name: "Land Preparation", series: [
            { name: "Planned", start: new Date(2018,07,18), end: new Date(2018,08,26) },
            { name: "Actual", start: new Date(2018,07,18), end: new Date(2018,08,30), color: "#ff0000" }
        ]
    }, 
    {
        id: 6, name: "Provision of Access...", series: [
            { name: "Planned", start: new Date(2018,08,26), end: new Date(2018,09,15) },
            { name: "Actual", start: new Date(2018,08,26), end: new Date(2018,09,15), color: "#00ff00" },
            //{ name: "Projected", start: new Date(2018,00,06), end: new Date(2018,00,20), color: "#e0e0e0" }
        ]
    }, 
    {
        id: 7, name: "Area Isolation...", series: [
            { name: "Planned", start: new Date(2018,09,15), end: new Date(2018,10,05) },
            { name: "Actual", start: new Date(2018,09,16), end: new Date(2018,10,04), color: "#00ff00" },
        ]
    }, 
    {
        id: 8, name: "Delivery of Seedlings", series: [
            { name: "Planned", start: new Date(2018,10,01), end: new Date(2018,10,19) },
            { name: "Actual", start: new Date(2018,10,01), end: new Date(2018,10,20), color: "#ff0000" }
        ]
    }, 
    {
        id: 9, name: "Inspection & Acceptance", series: [
            { name: "Planned", start: new Date(2018,10,01), end: new Date(2018,10,06) },
            { name: "Actual", start: new Date(2018,10,01), end: new Date(2018,10,06), color: "#00ff00" }
        ]
    }, 
    {
        id: 10, name: "Nursery Establishment", series: [
            { name: "Planned", start: new Date(2018,10,01), end: new Date(2018,10,20) },
            { name: "Actual", start: new Date(2018,10,01), end: new Date(2018,10,20), color: "#00ff00" }
        ]
    }, 
    {
        id: 8, name: "Transplanting of Seedlings", series: [
            { name: "Planned", start: new Date(2018,10,21), end: new Date(2018,10,26) },
            { name: "Actual", start: new Date(2018,10,21), end: new Date(2018,10,30), color: "#ff0000" }
        ]
    }, 
    {
        id: 8, name: "Application of Fertilizers", series: [
            { name: "Planned", start: new Date(2018,11,01), end: new Date(2018,11,06) },
            { name: "Actual", start: new Date(2018,11,01), end: new Date(2018,11,07), color: "#0000ff" }
        ]
    }
];

index.html

<script type="text/javascript" src="data.js"></script>
        <script type="text/javascript">
            $(function () {
                $("#ganttChart").ganttView({ 
                    data: ganttData,
                    slideWidth: 900,
                    behavior: {
                        onClick: function (data) { 
                            var msg = "You clicked on an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }";
                            $("#eventMessage").text(msg);
                        },
                        onResize: function (data) { 
                            var msg = "You resized an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }";
                            $("#eventMessage").text(msg);
                        },
                        onDrag: function (data) { 
                            var msg = "You dragged an event: { start: " + data.start.toString("M/d/yyyy") + ", end: " + data.end.toString("M/d/yyyy") + " }";
                            $("#eventMessage").text(msg);
                        }
                    }
                });

                // $("#ganttChart").ganttView("setSlideWidth", 600);
            });
        </script>

$（函数（）{
$（“#甘特哈特”）.GantView（{
数据：甘特图，
滑动宽度：900，
行为：{
onClick:函数（数据）{
var msg=“您单击了一个事件：{start:+data.start.toString（“M/d/yyyy”）+”，end:+data.end.toString（“M/d/yyyy”）+“}”；
$（“#事件消息”）.text（msg）；
},
onResize:函数（数据）{
var msg=“您调整了事件的大小：{start:+data.start.toString（“M/d/yyyy”）+”，end:+data.end.toString（“M/d/yyyy”）+“}”；
$（“#事件消息”）.text（msg）；
},
onDrag：函数（数据）{
var msg=“您拖动了一个事件：{start:+data.start.toString（“M/d/yyyy”）+”，end:+data.end.toString（“M/d/yyyy”）+“}”；
$（“#事件消息”）.text（msg）；
}
}
});
//$（“#甘特图”）。甘特视图（“setSlideWidth”，600）；
});

使用

data.js

我能够强制显示数据，因为它是硬编码的。但我需要的是使用

mysql\u fetch\u array

，因为我需要解析

数据库中的数据，而不是硬编码的数据

请帮我做这件事好吗？下面是我的数据库结构：

向PHP脚本发出AJAX请求

让PHP执行DB调用

json\u编码
结果数组

header（'Content-Type:application/json'）

然后回显
$json
并退出。
嗨，欢迎来到SO！但这个问题太宽泛了。我们互相帮助解决代码问题，我们不会为您编写新代码来询问主题问题，请阅读并了解如何创建，您可以使用javascript执行.php页面，然后获取响应（如果您想要的是？）。在你的.php页面中，你需要这样你的javascript才能正确阅读它搜索Ajax，你应该有你的答案谢谢@RiggsFolly，但我关心的不仅仅是如何将
php
代码传递给
javascript
。我正在尝试生成一个
甘特图
，其中
php
作为服务器，
javascript
作为接口。我有一个现有的代码，如上所述。所以没有必要写一个新的。第四，我知道如何编写这两种代码，尤其是在
php
中。请告诉我如何播放代码，使
php
和
javascript
（
php
code-in
.js
文件）在显示
甘特图的单个页面上协同工作，谢谢。