使用Ajax和PHP刷新数据库数据Div时遇$未定义错误求助

错误原因 #

这个报错的核心是你没引入jQuery库——代码里的$是jQuery的专属简写标识符，浏览器找不到jQuery时，自然无法识别$，就会抛出这个引用错误。

另外你的代码还有两个小问题：

• 选择器不匹配：要刷新的div是class="commandes"，但JS里用了ID选择器$('#commandes')，两者对应不上；
• PHP逻辑错误：if ($row['enc_paye'] = 0)是赋值操作，不是比较判断，会导致逻辑完全错误，应该用==（或===严格比较）。

修复步骤 #

1. 引入jQuery库：在HTML的<head>标签里添加jQuery的引入代码，必须放在自定义JS脚本之前；
2. 修正选择器：把$('#commandes')改成类选择器$('.commandes')；
3. 修正PHP比较逻辑：把if ($row['enc_paye'] = 0)改成if ($row['enc_paye'] == 0)。

修改后的完整代码示例 #

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title></title>
    <!-- 引入jQuery库 -->
    <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
</head>
<body>
    <div class="commandes">
     <?php
            $sql = "SELECT enc_id, enc_cmd_num, enc_paye, enc_prepared, enc_ext_ref, enc_heure_fab_deb, enc_type, enc_heure_fab_fin, Client.cli_civilite,Client.cli_nom, Client.cli_prenom FROM Client RIGHT JOIN encaissement ON Client.cli_id = encaissement.enc_client WHERE enc_etat<>4 AND enc_date= convert(date,getdate()) AND ((DATEDIFF(n,enc_heure_fab_fin, getDate()) < 3 AND enc_prepared <> 0) OR enc_prepared = 0) AND enc_emporte <> 1 ORDER BY encaissement.enc_heure_fab_deb ASC";

            $results = odbc_exec( $conn, $sql );
    ?>


<table>
            <?php
                while( $row = odbc_fetch_array( $results ) )
                {
                    printf('<tr>');

                    if ( $row["enc_ext_ref"] != '')
                        {
                            $num_cmd = $row["enc_ext_ref"];
                        }
                    else
                        {
                            $num_cmd =$row["enc_cmd_num"];
                        }


                    // 修正赋值为比较操作
                    if ($row['enc_paye'] == 0)
                    {
                        $etat_cmd='<span class="PRETE">ATTENTE REGLEMENT</span>';
                    }
                    else
                    {
                        switch( $row['enc_prepared'] )
                        {
                            case 0: $etat_cmd='<span class="ENPREPA">EN PREPARATION</span>'; break;

                            case 1:
                                $etat_cmd='<span class="PRETE">COMMANDE PRETE</span>'; break;
                        }
                    }


                    switch( $row['enc_type'] )
                    {
                        case 0: $commande='<span class="EMPORTER"></span>'; break;

                        case 1: $commande='<span class="LIVRAISON"></span>'; break;

                        case 2: $commande='<span class="SURPLACE"></span>'; break;
                    }



                    printf('<td>%s%s%s</td>',$row["enc_cmd_num"],$etat_cmd, $commande);
               
                }

            ?>



            </table>
        </div>

        <script>
            function loadlink(){
                // 修正为类选择器
                $('.commandes').load('commandes.php', function() {

                });
            }

            loadlink();
            setInterval(function(){
                loadlink()
            }, 10000);
        </script>
</body>
</html>

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