2

I am using the jquery autocomplete plugin, and am trying to trigger the autocomplete manually based on certain keys the user enters. I'm trying to bind the autocomplete to the input on the fly so the autocomplete can start looking for matches once a user enters a certain key to trigger "I'm now entering data to be searched on", which could be in the middle of the field, not necessarily at the beginning.

I'm binding a keypress event to an input. When the user enters a certain key, like "=", I want to display all of the elements in the array. When the user then enters a letter it would autocomplete the options that match from the array for that character on. This is more or less trying to mimic what happens in Excel, when a user hits the equals key and sees the functions available, except the "=" key does not have to be the first element in the input, it should autocomplete every time "=" is pressed and unbind that ac every time an option is selected.

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);
  }

});

Even if I get the autocomplete to trigger, if the user has entered anything before the text that might match, it wouldn't match because of the previous text. So, if the user enters "abd =", the autocomplete is getting "abb =" as its q parameter and not just "=".

Any help is really appreciated, im so stuck!!

4

2 回答 2

4

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

打开插件代码并找到函数 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);
                }
    });
});

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

于 2009-07-30T03:49:24.553 回答
1

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

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

然后你像这样在你的 sorce 函数中引用 keydownEvent

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

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

于 2012-11-24T02:19:24.663 回答