【问题标题】:jQuery Autocomplete - prevent call on specific keypress (left & right arrow)jQuery Autocomplete - 防止调用特定按键(左右箭头)
【发布时间】:2017-03-25 15:22:27
【问题描述】:

根据下面的代码给出一个简单的自动完成功能,我怎样才能避免仅在按下特定键(在本例中为左右箭头)时才调用自动完成功能

为了清楚起见,我要避免的调用是 autocomplete 一个(返回自动完成建议列表),而不是 select 一个

我想我需要event.stopPropagation(根据here),但我不清楚如何将其限制为特定键

    $("#myAutoComplete").autocomplete({   
        source: function (request, response) {
            $.ajax({
                type: "POST",
                contentType: 'application/json',
                data: some_json_package,
                success: response,
                dataType: 'json'
            });
        },        
        minLength: 2,
        select: autocompleteSelectFunction,
    });                        

编辑:为了进一步澄清这个用例,问题是当用户使用左右箭头导航来编辑自动完成时,组件认为已经进行了编辑并调用自动完成,从而生成一个新的建议列表(与上一个相同,因为用户没有输入新数据,只是向左或向右移动箭头)

【问题讨论】:

    标签: javascript jquery jquery-ui autocomplete


    【解决方案1】:

    这有点脏,但这里有一个可行的解决方案:

    https://jsfiddle.net/9sz4pjqc/

    如果最后按下的键不是左箭头或右箭头,它只会调用源。我使用了默认的 jQuery UI 自动完成示例,因为 JSON 在 JSfiddle 中当然不起作用,但我相信您可以根据自己的情况改进此示例 ;-)

    这个小脚本会将最后按下的键保存在一个变量中:

    $('#myAutoComplete').on("keyup", function(e) {
      var code = (e.keyCode || e.which);
      if (code == 37 || code == 39) {
        arrowKeyPressed = 1;
        console.log('Left/Right');
      } else {
        arrowKeyPressed = 0;
        console.log('Not Left/Right');
      }
    });
    

    并且对source 的这种修改将使源仅在按下的最后一个键不是左箭头或右箭头时才提供给自动完成:

    source: function(request, response) {
        if (arrowKeyPressed == 0) {
          response( *** YOUR ORIGINAL AJAX/JSON SOURCE HERE *** );
        }
      }
    

    为了在应得的地方加分,我的解决方案是基于这些天才的工作:Show Jquery UI Autocomplete only when a special key is pressed

    【讨论】:

    • 所以你使用一个全局变量来跟踪,然后在源代码中检查它。非常感谢,也为链接
    猜你喜欢
    • 2013-10-21
    • 2011-12-20
    • 2014-01-19
    • 1970-01-01
    • 1970-01-01
    • 2013-07-02
    • 2020-11-16
    • 1970-01-01
    • 2016-10-07
    相关资源
    最近更新 更多