Ajax 功能在本地工作但不能在线

Question

这是我的问题，我有一个 AJAX 函数在我的本地服务器上运行，但是当我将它放在我的在线服务器上时不返回任何内容。

这是我的代码：

这里是我调用函数 showEspece() 的页面：

echo "<div class='tableau'>";
    	echo "<table class='tableAnimal'>\n";
            echo "<thead>\n";
                echo "<td class='tdAnimal'><b> Nom </b></td>\n";
                echo "<td class='tdAnimal'><b> Nombre </b></td>\n";
            echo "</thead>\n";
    		while ($row = oci_fetch_array($requete, OCI_ASSOC+OCI_RETURN_NULLS)) {
        		echo "<tr class='trAnimal'>\n";
        			foreach ($row as $item) {
            			echo "    <td class='tdAnimal'>" . ($item !== null ? htmlentities($item, ENT_QUOTES) : "") . "</td>\n";
        			} ?>
                        <td class='tdAnimal' onclick="showEspece(<?php echo "'";echo $row['ESPECE'];echo "'";?>, <?php echo "'";echo $categorie;echo "'";?>,this);" ><a class='lightbox'><img src='images/loupe.png'/></a></td> <?php
        		echo "</tr>\n";
    		}
    	echo "</table>\n\n";
    echo '</div>';

这里是 Ajax 函数：

function showEspece(espece, categorie, object) 
  {
    $.ajax({           
      type : 'POST',                           
      url: 'getespece.php',                  
      data: {espece: espece, categorie: categorie },                       
      dataType: 'json',                     
      success: function(data)          
      {
        alert('ok');
        var tableau = data;           
        $('#output').html(tableau); 
      },
      error: function(xhr, status, error) {
        console.log(xhr);
      }
    });
  }

这是Ajax函数的页面调用：

<?php
     include("/includes/connexionBD.php");
         include("includes/entetepage.php");


    $requete = oci_parse($connect, "SELECT nomA, sexe, datenaissance FROM Animal WHERE categorie = '".$_POST['categorie']."' AND espece = '".$_POST['espece']."' ");
    
	oci_execute($requete);

    	$table = "<table>\n";
            $table .= "<thead>\n";
                $table .= "<td><b> Nom </b></td>\n";
                $table .= "<td><b> Sexe </b></td>\n";
                $table .= "<td><b> Date naissance </b></td>\n";
            $table .= "</thead>\n";
    		while ($row = oci_fetch_array($requete, OCI_ASSOC+OCI_RETURN_NULLS)) {
        		$table .= "<tr>\n";
        			foreach ($row as $item) {
            			$table .= "    <td>" . ($item !== null ? htmlentities($item, ENT_QUOTES) : "") . "</td>\n";
        			}
        		$table .= "</tr>\n";
    		}
    	$table .= "</table>\n\n";

    	echo json_encode($table);
?>

这就是我在控制台上遇到的错误：

VM1130:1 Uncaught SyntaxError: Unexpected token < in JSON at position 0
at JSON.parse (<anonymous>)
at Object.error (ajax.js:16)
at i (jQuery.js:2)
at Object.fireWith [as rejectWith] (jQuery.js:2)
at A (jQuery.js:4)
at XMLHttpRequest.<anonymous> (jQuery.js:4)

有人知道问题出在哪里并可以帮助我吗？

对不起，我的英语不好：/

Answer 1

这里的问题是您的 JSON 响应格式不正确，您可以尝试获取输出 JSON 并将其放入 linter 以查找问题的实际位置：

https://jsonlint.com/

我建议不要在 PHP 中构建 HTML（您的表格），而是使用 Javascript 构建它并将 Ajax 请求中的数据注入表格中。

Answer 2

用以下代码更改 php 响应代码，

<?php
 include("/includes/connexionBD.php");
     include("includes/entetepage.php");


$requete = oci_parse($connect, "SELECT nomA, sexe, datenaissance FROM Animal WHERE categorie = '".$_POST['categorie']."' AND espece = '".$_POST['espece']."' ");

oci_execute($requete);

    $table = "<table>\n";
        $table .= "<thead>\n";
            $table .= "<td><b> Nom </b></td>\n";
            $table .= "<td><b> Sexe </b></td>\n";
            $table .= "<td><b> Date naissance </b></td>\n";
        $table .= "</thead>\n";
        while ($row = oci_fetch_array($requete, OCI_ASSOC+OCI_RETURN_NULLS)) {
            $table .= "<tr>\n";
                foreach ($row as $item) {
                    $table .= "    <td>" . ($item !== null ? htmlentities($item, ENT_QUOTES) : "") . "</td>\n";
                }
            $table .= "</tr>\n";
        }
    $table .= "</table>\n\n";

    echo json_encode(array("table"=>$table, JSON_UNESCAPED_SLASHES));
?>

使用以下代码更改 ajax 代码

function showEspece(espece, categorie, object) 
{
    $.ajax({           
        type : 'POST',                           
        url: 'getespece.php',                  
        data: {espece: espece, categorie: categorie },                       
        dataType: 'json',                     
        success: function(data)          
        {
            alert('ok');
            var tbl = $.parseJSON(data);
            var tableau = tbl.table;
            console.log(tableau);           
            $('#output').html(tableau); 
        },
        error: function(xhr, status, error) {
            console.log(xhr);
        }
   });
}