javascript - 3 个字符后执行 Ajax 搜索

Question

在用户输入 3 个字符后，我如何进行 Ajax 搜索？我不是 javascript 方面的专家，但到目前为止，这是我的 HTML 文件：

<form>
<input type="text" id="searchField" name="searchField" placeholder="...">
</form>

<script>
    $('#searchField').searchbox({
    url: 'components/search_ajax.php',
    param: 'q',
    dom_id: '#searchResult',
    delay: 0,
    loading_css: '#spinner'
    });
</script>

目前，仅在按下退格按钮时才调用搜索（然后表示我的所有数据库条目，因为存在没有字符的匹配搜索）。

提前致谢！问候。

Answer 1

首先，您需要让我们知道您使用的是哪个插件，我感觉是这个，如果是，请更改：

process: function(terms) {

至

process: function(terms) {
  if(terms.length < 3) return;

但是你也应该在你的服务器端限制这个，否则我可以直接去你的脚本查看所有条目。您可以在php文件顶部执行此操作：

if(strlen(trim($_GET['q'])) < 3) return; // only basic, would need more checks

Answer 2

做这个：

$('#searchField').change(function() {
 var value = $(this).val();
 if(value.length>= 3){
    ajax_search();
 }

});

function ajax_search(){
  $('#searchField').searchbox({
  url: 'components/search_ajax.php',
  param: 'q',
  dom_id: '#searchResult',
  delay: 0,
  loading_css: '#spinner'
  });
}