如何通过script标签将PHP值传递给JavaScript？变量未定义报错怎么解决

问题触发原因 #

• 第一，变量作用域问题：$burrCordResult 仅在 if (isset($_POST['search'])) 代码块内部被定义，如果当前请求没有携带POST参数search，这个变量在全局PHP作用域不存在，后续输出JS变量的代码就无法拿到值，导致JS变量BurrLoc定义失败。
• 第二，数组输出错误：就算进入了if判断块，你直接用<?= $burrCordResult ?>输出数组，PHP会直接将数组转为字符串Array，无法得到你想要的数组内容，同时如果内容包含特殊字符还可能破坏JS语法。
• 第三，代码执行顺序问题：如果你的console.log(BurrLoc)代码写在定义BurrLoc的script标签之前，JS解析时还没有这个变量，也会触发未定义错误。

修复方案 #

1. 提前初始化PHP变量 #

在if判断块外提前给$burrCordResult定义默认值，保证变量全局存在。

2. 使用json_encode输出变量到JS #

json_encode可以自动将PHP的数组、字符串等类型转为符合JS语法的变量值，自动处理转义、引号问题，避免语法错误。

3. 保证JS变量定义在前、调用在后 #

修改后的PHP代码 #

<?php
// 先初始化变量，保证全局存在
$burrCordResult = [];
if (isset($_POST['search']))
{
    $startDate = $_POST['start'];
    $startDate = str_replace('/', '-', $startDate ); 
    $startDate = date("Y-m-d", strtotime($startDate));
    
    $endDate = $_POST['end'];
    $endDate = str_replace('/', '-', $endDate ); 
    $endDate = date("Y-m-d", strtotime($endDate));

    $model = $_POST['model'];

    $dates = getDatesStartToLast($startDate, $endDate);

    for ($i=0; $i < count($dates); $i++){
        echo "<form method = 'post'>";
        echo "<tr>";
        echo "<td><button type = 'submit' style = 'border-color : white; background-color : white; outline : 0; border : 0' name = 'datebutton' value = '$model,$dates[$i]'>$dates[$i]</td>";
        echo "</form>";
        $query = mysqli_query($conn, "SELECT * from elentec_count where Date = '$dates[$i]' and model = '$model'");
        $row = mysqli_fetch_row($query);
        echo "<td>$row[2]</td><td>$row[3]</td><td>$row[4]</td><td>$row[5]</td><td>$row[6]</td><td>$row[7]</td>";
    }    
    $burrCordResult = updateChart($conn, $model, $dates);
    $burrCordResult = ['mon', 'Tue'];
    // 注意不要在输出JS变量前输出print_r内容，会破坏页面结构
    // print_r($burrCordResult);
}
?>
<!-- 用json_encode输出变量，无需手动加引号 -->
<script>var BurrLoc = <?= json_encode($burrCordResult) ?>;</script>

JS调用要求 #

调用代码必须放在上述定义BurrLoc的script标签之后：

console.log(BurrLoc);

额外注意 #

你当前代码直接把用户提交的$model、$dates[$i]拼接进SQL语句，存在SQL注入风险，建议改用预处理查询优化。

内容的提问来源于stack exchange，提问作者ZOOOO