jQuery自动完成焦点多次触发

时间:2018-08-09 07:06:22

标签: jquery autocomplete

我很难弄清楚为什么outter focus事件被多次触发。每次我在该输入字段中单击时,都会一次又一次触发该事件。

$(document).ready(function() {
  $(document).on('focus', '.aSuggest', function(event) {

    var aTags = [
      "ask",
      "always",
      "all",
      "alright",
      "one",
      "foo",
      "blackberry",
      "tweet",
      "force9",
      "westerners",
      "sport"
    ];

    $(this).autocomplete({
      source: aTags,
      minLength: 0,
      delay: 500,
      focus: function(event, ui) {
        console.log("focus");
      },
      select: function(event, ui) {
        console.log("select");
      },
      open: function() {
        console.log("open");
      },
    }).focus(function(event) {
      console.log("outter focus");
    });
  });
});

我想做什么:

我想在输入字段的焦点事件中初始化自动完成功能。只要输入字段具有值并失去焦点,然后输入字段将再次获得焦点,则自动完成的结果应再次打开。 我知道该怎么做,但是问题是事件被多次触发。

JSFiddle

https://jsfiddle.net/xbjmae8c/10/

有人可以帮我吗?

1 个答案:

答案 0 :(得分:0)

问题解决了。。。

$(document).ready(function() {
    var $aSuggestAutocomplete;

    $(document).on('focusin', '.aSuggest', function(event) {
    console.log('focusin');
    if (this.value) {
        console.log('autocomplete search triggered from .aSuggest');
        $aSuggestAutocomplete.autocomplete("search", this.value);
    }
  });

  $(document).on('focus', '.aSuggest', function(event) {

    var aTags = [
      "ask",
      "always",
      "all",
      "alright",
      "one",
      "foo",
      "blackberry",
      "tweet",
      "force9",
      "westerners",
      "sport"
    ];

    $aSuggestAutocomplete = $(this).autocomplete({
      source: aTags,
      minLength: 0,
      delay: 500,
      focus: function(event, ui) {
        console.log("focus");
      },
      select: function(event, ui) {
        console.log("select");
      },
      open: function() {
        console.log("open");
      },
    })/*.focus(function(event) {
      console.log("outter focus");
    });
    */
  });
});