输入时带有自动完成功能的 Jquery 搜索答案

【问题标题】：Jquery search on enter with autocomplete输入时带有自动完成功能的 Jquery 搜索
【发布时间】：2012-05-20 03:12:00
【问题描述】：

我有一些运行良好的 JQuery。它加载所有自动完成值，并在单击它们时加载执行所有搜索的 searchdata.php。这行得通。

我想不通的是，如果用户决定他们不想选择自动完成值并按回车键，我如何让它对搜索中的值执行 searchdata.php在不重新加载页面的情况下按回车输入？我已经尝试过 bind 和 live 但无法正常工作。

<script type="text/javascript">
$(document).ready(function() {

var availableTags = <?php echo json_encode($findrow);?>;

  $("#search_input").watermark("Begin Typing to Search");
  $('#searchresultdata').append(sendSelected);

    $("#search_input").autocomplete({
        source: availableTags,
        select: function(event, ui) {
          sendSelected(ui.item.value);
          }
        });

function sendSelected(_val){
    var search_input = _val;
    if (search_input =='') search_input ='*';
    var dataString = 'keyword='+search_input;

    if (search_input.length > 2 || search_input=='*') {
       $.ajax({
            type: "GET",
            url: "core/functions/searchdata.php",
            data: dataString,
            success: function(server_response) {
                $('#searchresultdata').empty();
                $('#searchresultdata').append(server_response);
                $('span#category_title').html(search_input);
            }
        });
    }
}
});
</script>

【问题讨论】：

jQuery AutoComplete Trigger Change Event 的可能重复项 - 相同但使用 select 事件（它们应该具有相同的处理程序）

标签： jquery jquery-ui

【解决方案1】：

$("#search_input").keypress(function(e) {
  if(e.keyCode == 13)
     {
         e.preventDefault();
         sendSelected(this.value);
         $(this).autocomplete('close');
     }
});

【讨论】：

啊，谢谢，我只是在尝试，但已将其包含在自动完成语句中。有没有办法在他们按回车时关闭自动完成框，这样它就不会覆盖我的结果？
@K20GH 肯定有；看我的编辑。添加$(this).autocomplete('close') 以触发关闭方法。

【解决方案2】：

$("#search_input").on('keyup', function(event) {
  if(event.which == 13)  // event.which detect the code for keypress in jQuery
     {
         event.preventDefault();
         sendSelected(this.value);
     }
});

【讨论】：

【解决方案3】：

您可以在操作上使用event.preventDefault()，它不会提交页面，您只需要确保在需要时将其打开和关闭

http://api.jquery.com/event.preventDefault/

【讨论】：