意外的符号< AJAX jquery

Question

我遇到了AJAX的问题。当我通过AJAX发送请求时，首先从xhr.status得到200（好的）状态码。但是接下来，我收到了一个syntaxerror: unexpected token <的错误信息。

可能是因为它是HTML标签的一部分吗？我的头文件是application/json，那么问题可能是什么呢？这里是我所有的文件： HTML

       <?
 require_once('../includes/helpers.php'); //just setting up

 session_start();


 //Google Maps API key: AIzaSyDUE08r9kD1p5QsqOzmI6_EcoUNCJntf5I

 render('header', array('title' => 'BART index'));  
        ?>


      <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDUE08r9kD1p5QsqOzmI6_EcoUNCJntf5I&sensor=false"></script>
      <script type="text/javascript">

       function initialize() { //start the map. code from google maps tutorial.
        var mapOptions = {
          center: new google.maps.LatLng(37.7750, -122.4183),
          zoom: 11,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);
      }
      </script>

         <script type="text/javascript">

         $(document).ready(function() {
       $("#submit").click(function() {

            console.log($("#route").val());
            $.ajax ({
                type: "GET",
                responseType: "json",
                url: "stations.php",
                data: {
                    route: $("#route").val()
                },
                success: function(data) {
                    console.log(data);
                    var i = 1;
                    var routePathCoords = [];
                    var pathColor = data.color; 
                    console.log(data.stations);
                    $.each(data.stations, function() {
                        routePathCoords.push(new google.maps.LatLng(data.lat[i], data.longit[i]));
                        i++;
                    });

                    function initialize() { //start the map. code from google maps tutorial.
                            var mapOptions = {
                              center: new google.maps.LatLng(37.7750, -122.4183),
                              zoom: 11,
                              mapTypeId: google.maps.MapTypeId.ROADMAP
                            };

                            var map = new google.maps.Map(document.getElementById("map_canvas"),
                                mapOptions);
                          }

            },
            error:function (xhr, ajaxOptions, thrownError){
                    console.log(ajaxOptions);
                    alert(xhr.status);
                    alert(thrownError);
                }    
        });
        return false;
    });
    });

     </script>

    <? 
    render('header2'); 
    ?>

      <form id="form" class="form-inline">

    <input type="hidden"><select type="text" name="route" id="route">
        <option name="route">Pittsburg/Bay Point - SFIA/Millbrae</option>
        <option name="route">Fremont - Richmond</option>
        <option name="route">Fremont - Daly City</option>
        <option name="route">Richmond - Daly City/Millbrae</option>
        <option name="route">Dublin/Pleasanton - Daly City</option>
    </select>

    <input type="submit" value="Route" class="btn" id="submit">

      </form>



      <div id="map_canvas" style="width:500px; height:500px"></div>

   <? 
    render('footer'); 
   ?>

PHP

 <?
    require_once("../includes/helpers.php");
    session_start();

    $dbh = connect_db('mysql:host=localhost;dbname=project2', '*****', '*****');

    //defining class Route
    class Route {
        public $stations = array();
        public $color;
        public $lat = array();
        public $longit = array();
    }

    header("Content-type: application/json");

    $route = htmlspecialchars($_GET['route']); //getting desired route

    //find route within database
    $query = $dbh->query("SELECT color, lat, longit, station FROM stations WHERE route='$route'");

    var_dump($query);

    if ($query->rowCount() > 0) { //does query exist?
        $route = new Route();

        foreach ($query as $row) { //getting all variable names

            $route->color = $row['color']; //then setting them to object variables

            foreach ($query as $value) {

                array_push($route->stations, $value['station']); //adding on for each station to the array
                array_push($route->lat, $value['lat']); //adding latitude
                array_push($route->longit, $value['longit']); //and longitude
            }


            break;
        }
    }

    json_encode($route);

 ?>

很抱歉排版不佳，感谢您的帮助。

- irosenb

---

我用 ***** 替换了您的用户名 / 密码。 - Manse

意思是：意外的 < 在哪一行？ - Matt

哦！谢谢！我没注意到！ - irosenb

我不确定。它没有说明 < 在哪里。 - irosenb

Answer 1

你没有输出任何内容...请更改

json_encode($route);

为了

echo json_encode($route);

调试这类问题的最佳方式是使用像firebug这样的工具 - 你可以看到实际的通信内容和数据。

- Manse

---

我不确定这是否完全正确，因为我一次性进行了所有更改，但是非常感谢你们！！！ - irosenb

我建议需要完成所有3个答案来解决您的问题。 - Manse

Answer 2

也许你应该移除 var_dump($query);？

- Vitalii Zurian

Answer 3

你应该使用dataType而不是responseType - 参见jQuery.ajax。也许这就是问题的一部分？

- Justin Ethier