Question

我正在使用jquery自动完成插件，并尝试根据用户输入的某些键手动触发自动完成。我正在尝试将自动完成绑定到动态输入，这样一旦用户输入某个键以触发“我现在正在输入要搜索的数据”，自动完成就可以开始寻找匹配，这可能是在中间该领域，不一定在开头。

我将按键事件绑定到输入。当用户输入某个键，如“=”时，我想显示数组中的所有元素。当用户输入一个字母时，它将自动填充与该字符的数组匹配的选项。这或多或少试图模仿Excel中发生的事情，当用户点击等号键并看到可用的函数时，除了“=”键不必是输入中的第一个元素，它应该每次都自动完成“每次选择一个选项时，都会按下并取消绑定。

var array1 = ['one','two','three'];

$.input1.bind('keypress', function(event) {
  var keyCode;
  if (event.keyCode > 0) {
    keyCode = event.keyCode;
  } else if (typeof(event.charCode) != "undefined") {
    keyCode = event.charCode;
  }

  if (String.fromCharCode(keyCode) == '=') {
    $.input1.unbind('keypress');  

    $.input1.autocomplete(array1);

    $.input1.blur();
    $.input1.focus();
    e = $.Event('keydown');
    e.which = keyCode;
    $.input1.trigger(e);
  }

});

即使我触发了自动完成功能，如果用户在可能匹配的文本之前输入了任何内容，则由于之前的文本而无法匹配。因此，如果用户输入“abd =”，则自动完成功能将“abb =”作为其q参数，而不仅仅是“=”。

任何帮助都非常感谢，我很卡住!!

Answer 1

您真正需要的是能够在自动完成插件执行搜索之前过滤字段的值。看看插件看起来不像是内置的。但这并不能阻止我们添加它。

打开插件代码并找到函数lastWord（），查看第261行。然后将其添加到该函数：

if ( options.formatValue ){
    value = options.formatValue(value);
}

所以lastWord函数应如下所示：

function lastWord(value) {
    if ( options.formatValue ){
        value = options.formatValue(value);
    }
    if ( !options.multiple )
        return value;
    var words = trimWords(value);
    return words[words.length - 1];
}

然后在您的jquery代码中，您可以执行以下操作：

$(document).ready(function(){
    var array1 = ['one','two','three'];
    $('#test').autocomplete(array1,{
                formatValue: function(value){
                    if (value.search('=') == -1) return '';
                    return value.substring(value.search('=')+1);
                }
    });
});

这将允许您在搜索之前过滤和格式化字段的值。由于您只想进行搜索，如果值中包含“=”字符，则搜索它，如果未找到，则返回空字符串。如果它发现你删除它和它之前的所有内容并返回用户在其后输入的内容。

Answer 2

您可以通过添加第二行代码修改autocomplete.js

  ...
  .bind( "keydown.autocomplete", function( event ) {
+ self.options.keydownEvent=event;
  if ( self.options.disabled ) {...

然后你在你的魔法函数中引用keydownEvent就像这样

source:function(){
var event=this.options.keydownEvent;
... //Handling the event

请记住，var事件有一个字段。例如，如果event.which为13，则按下Enter键。希望它有所帮助。

jquery keypress事件仅在特定密钥代码上触发自动完成

2 个答案: