2

当用户点击退格键时,将触发搜索。我怎样才能防止这种情况发生?我尝试了以下代码,但它似乎仅在第二次按下退格键后才起作用。

var $cached_input = $("#myinput");

$cached_input.autocomplete({
    autoFocus: true,
    delay: 700,
    open: function (event, ui) {
        $(this).autocomplete("widget")
         .find("ui-menu-item-alternate")
          .removeClass("ui-menu-item-alternate")
         .end()
         .find("li.ui-menu-item:odd a")
          .addClass("ui-menu-item-alternate");
    },
    source: function (request, response) {
        var params = { searchTerm: request.term }

        //ajax call made here to load the data...
    },
    minLength: minChars
}).keydown(function (event) {
    if (event.keyCode == 8) {
        $cached_input.autocomplete("disable");
    } else {
        $cached_input.autocomplete("enable");
    }
});

编辑 作为一种解决方法,我已经实施了以下更改(每个更改旁边的注释),它似乎可以完成这项工作。如果存在更好的解决方案,仍然可以接受。

var $cached_input = $("#myinput");
var performSearch = true; //added variable to determine if I should search

$cached_input.autocomplete({
    autoFocus: true,
    delay: 700,
    open: function (event, ui) {
        $(this).autocomplete("widget")
         .find("ui-menu-item-alternate")
          .removeClass("ui-menu-item-alternate")
         .end()
         .find("li.ui-menu-item:odd a")
          .addClass("ui-menu-item-alternate");
    },
    source: function (request, response) {
        if (performSearch) { //check variable before performing search
            var params = { searchTerm: request.term }

            //ajax call made here to load the data...
        }
    },
    minLength: minChars
}).keydown(function (event) {
    if (event.keyCode == 8) {
        performSearch = false; //do not perform the search
    } else {
        performSearch = true; //perform the search
    }
});
4

3 回答 3

1

作为一种解决方法,我已经实施了以下更改(每个更改旁边的注释),它似乎可以完成这项工作。如果存在更好的解决方案,仍然可以接受。

var $cached_input = $("#myinput"); var performSearch = true; //added variable to determine if I should search

$cached_input.autocomplete({
    autoFocus: true,
    delay: 700,
    open: function (event, ui) {
        $(this).autocomplete("widget")
         .find("ui-menu-item-alternate")
          .removeClass("ui-menu-item-alternate")
         .end()
         .find("li.ui-menu-item:odd a")
          .addClass("ui-menu-item-alternate");
    },
    source: function (request, response) {
        if (performSearch) { //check variable before performing search
            var params = { searchTerm: request.term }

            //ajax call made here to load the data...
        }
    },
    minLength: minChars }).keydown(function (event) {
    if (event.keyCode == 8) {
        performSearch = false; //do not perform the search
    } else {
        performSearch = true; //perform the search
    } });
于 2019-06-27T20:34:08.537 回答
0

我会做

$(document).on('keyup cut paste change keydown', 'input[data-input_type="autocomplete"]', function (e) {
 $(this).autocomplete({
        source: mySource();
}

通过这种方式,您可以控制在这种情况下将触发自动完成的事件:keyup、cut、paste 和 keydown。其中 data-input_type = "autocomplete" 是输入的个人标记,只是说它属于 DOM 元素的自动完成组,但您可以通过类或任何您想要的方式调用它。希望这可以帮助某人。

于 2014-06-10T15:27:18.990 回答
0

试试这个代码

$cached_input.autocomplete({
    autoFocus: true,
    delay: 700,
    open: function (event, ui) {
        $(this).autocomplete("widget")
         .find("ui-menu-item-alternate")
          .removeClass("ui-menu-item-alternate")
         .end()
         .find("li.ui-menu-item:odd a")
          .addClass("ui-menu-item-alternate");
    },
    source: function (request, response) {
        var params = { searchTerm: request.term }

        //ajax call made here to load the data...
    },
    minLength: minChars
}).keyup(function (e) {
            if (e.keyCode === 13) {
                $cached_input.autocomplete("enable");
                $cached_input.autocomplete("search", $cached_input.val());
            }
            else if ((e.keyCode == 8) || (this.value == "") || (e.keyCode == 46)) 
            {
                $cached_input.autocomplete("disable");
            }
于 2013-08-27T17:17:51.457 回答