php - 在文本框中输入时不显示自动完成功能，但值显示在控制台中

Question

我有一个文本框，我使用 Material 设计自动完成功能在其上执行自动完成操作。输入值后，AJAX 调用成功并返回值；但是结果没有显示在文本框中。

下图显示了正在返回的数据。

JS 代码

$(document).ready(function() {
  $(document).on('input', 'input.autocomplete', function() {
    var inputText = $(this).val();
    //alert(inputText);
    $.ajax({
      type: 'GET',
      data:'country='+inputText,
      url: '../inc/tax/server.php',
      //dataType: "json",
      success: function(response) {
         console.log(response);
        var countryArray = response;
        var countryList = {};
        console.log(response);
        for (var i = 0; i < countryArray.length; i++) {
          countryList[countryArray[i].name] = countryArray[i];
        }
        $('input.autocomplete').autocomplete({
          data: countryList
        });
      }
    });
  });
});

PHP 代码:

    $keyword = strval($_GET['country']);
    $search_param = "%$keyword%";

    $sql = mysqli_query($mysqli,"SELECT * FROM countries WHERE name LIKE '$search_param'");

    if (mysqli_num_rows($sql) > 0) {
        while($row = mysqli_fetch_assoc($sql)) {
        $countryResult[] = $row["name"];
        }
        echo json_encode($countryResult);
    }
    $mysqli->close();

Answer 1

尝试取消注释:

//dataType: "json",

并且您始终应该发送 MIME header PHP 响应:

header('Content-type:application/json;charset=utf-8');

此代码添加在代码中的第一个 echo 之前 ( learn more )。