Javascript JS控制台在使用ajax从db获取非英语字符的数据时抛出错误

我正在使用MAMP for Mac开发简单的web应用程序。页面上有一个元素，该元素由以下代码生成：

显示\u store\u list.php

问题1它的渲染基本正确，但一些商店名称具有非英语字符，这些字符显示为� 符号。数据库、表和名称都有排序规则utf8_unicode_ci，值在phpMyAdmin中用ä和ö正确显示。 我做了这项研究，唯一有效的方法是将其包含到我的display_store_list.php中：

没有正确呈现带有上述字符的名称，但是，它不能解决问题2

问题2我有一个js脚本，当用户从列表中选择某个商店时，它使用jquery ajax和handlebar.js加载与所选商店地址、电话号码等相关的其他数据

var source   = $("#store-info").html();
var template = Handlebars.compile(source);

$('#valitse').change(function(event) {
    var id = $(this).val();

    console.log(id);
    if(id == "") {
        return false;
    }
    //Make AJAX request, using the selected value as id in the GET
    else {
        $.ajax({url: 'store_info.php?q='+id,
              success: function(data) {

                console.log(data);

                //Parsing data to object
                var context = $.parseJSON(data);

                //Insterting received data to template
                $(".store_details").html(template(context));

              },
              error: function (xhr, ajaxOptions, thrownError) {
                console.log(xhr.status + " "+ thrownError);
              }
        });
    }
});

当用户选择名称中没有特殊字符的storeä，ö时，它会按预期工作。使用这些字符选择store时，js控制台将激发：

未捕获的语法错误：输入localhost的意外结束/：1

而且脚本不起作用。当用户选择store脚本logs到console log时，它的值和两种情况下的值都已正确获取。 我哪里出错了

更新

store_info.php

更新2

即使我有

<?php header('Content-Type: text/html; charset=utf-8'); ?>

在我的标题中

 <?php echo mb_detect_encoding($str); ?> 

---

在页面上回显ASCII。

确定。事实证明，我没有以正确的方式对db中的数据进行编码

stackoverflower同伴实际上回答了我的问题。事实证明，在从数据库查询任何内容之前，必须在创建到db的连接之后，在开始任何查询之前调用mysql_set_charsetutf8

在我的例子中，它是mysqli\u set\u charset$link，紧跟其后的utf8

$conn=newmysqli$servername、$username、$password、$dbname

在我的db.php中。 jason数据不正确，使用非英语字符，脚本按预期执行。希望它能帮助别人

更新echo json\u last\u error\u msg；jason_encode$array每次尝试提取非英语字符格式错误的UTF-8字符（可能编码错误）的数据时都会给我错误信息。通过谷歌搜索，我找到了解决方案

var source   = $("#store-info").html();
var template = Handlebars.compile(source);

$('#valitse').change(function(event) {
    var id = $(this).val();

    console.log(id);
    if(id == "") {
        return false;
    }
    //Make AJAX request, using the selected value as id in the GET
    else {
        $.ajax({url: 'store_info.php?q='+id,
              success: function(data) {

                console.log(data);

                //Parsing data to object
                var context = $.parseJSON(data);

                //Insterting received data to template
                $(".store_details").html(template(context));

              },
              error: function (xhr, ajaxOptions, thrownError) {
                console.log(xhr.status + " "+ thrownError);
              }
        });
    }
});

    include('db.php');

$id = intval($_GET['q']);

$sql = " SELECT * FROM stores WHERE id = '".$id."' "; 

$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // output data 
    while($row = $result->fetch_assoc()) {
        //Defining virables
        $name=$row['name'];
        $address=$row['address1'];
        $phone=$row['phone'];
        $weekdays=$row['week'];
        $sat=$row['sat'];
        $sun=$row['sun'];
        $city=$row['city'];

        //Creating array
        $arrayStoreInfo = array(
            "Name" => $name,
            "Address" => $address, 
            "Phone" => $phone, 
            "Weekdays" => $weekdays,
            "Sat" => $sat,
            "Sun" => $sun,
            "City" => $city
        );

        //Send the array back to front end
        echo json_encode($arrayStoreInfo);

    }
} else {
    echo "Some problem with getting values related to that id from DB";
}   $conn->close();

<?php header('Content-Type: text/html; charset=utf-8'); ?>

 <?php echo mb_detect_encoding($str); ?>