JQuery用户界面自动填充缓慢选择的元素

问题描述:

<script type="text/javascript"> 
$(function() { 
$("#customers").autocomplete({ 
source: 'search.php' 
}); 
}); 
</script> 
<div class="ui-widget"><input id="customers" name="Cno" placeholder="Customer Name"></div> 

的search.phpJQuery用户界面自动填充缓慢选择的元素

<?php include('header.php'); 
//get search term 
$searchTerm = $_GET['term']; 
//get matched data from skills table 
$query = $db->query("SELECT * FROM customers WHERE Customer_Name LIKE '%".$searchTerm."%' ORDER BY Customer_Name ASC"); 
while ($row = $query->fetch_assoc()) { 
$data[] = $row['Customer_Name']; 
} 
//return json data 
echo json_encode($data); 
?> 

对于某些阵列如我在Jquery UI not working properly for some words描述并添加此代码

$mysqli->set_charset('utf8mb4') 

然后将其不工作细我从下拉列表中选择元素时遇到问题,将li类转换为ui-state-active需要很长时间,如何解决它?

任何帮助将是伟大的!

+0

首先,您的PHP代码易受SQL注入攻击。当您查看您的JS控制台时,您是否看到GET请求是否异常长?您可能需要添加'minLength:3'来帮助减少返回的结果集。 – Twisty

在问候你的PHP,我建议:

PHP

<?php 
    include('header.php'); 
    //get search term 
    $searchTerm = $_GET['term']; 
    $data = array(); 
    //get matched data from skills table 
    $query = $db->prepare("SELECT * FROM customers WHERE Customer_Name LIKE '%?%' ORDER BY Customer_Name ASC"); 
    $query->bind_param('s', $searchTerm); 
    $query->execute(); 
    $results = $query->get_result(); 
    while ($row = $results->fetch_assoc()) { 
    $data[] = $row['Customer_Name']; 
    } 
    $query->close(); 
    $db->close(); 
    //return json data 
    header('Content-Type: application/json'); 
    echo json_encode($data); 
?> 

这将帮助防止SQL注入脚本。

在问候你的jQuery的,我会建议:

的JavaScript

$(function() { 
    $("#customers").autocomplete({ 
    minLength: 3, 
    source: 'search.php' 
    }); 
}); 

如果你输入 'SIM卡' 自动完成将通过GET发送给你的PHP。响应将如下所示:

[ 
    "Bart Simpson", 
    "Homer Simpson", 
    "Lisa Simpson", 
    "Maggie Simpson", 
    "Marge Simpson" 
] 

在您的控制台中,您应该看到此活动并可以查看执行时间。这将告诉你PHP提供响应请求的时间。这些数据应该立即加载到自动填充中。

如果您看到缓慢,您将不得不确定它是否在您的PHP或JavaScript中。这将决定在哪里寻找问题。