【问题标题】:(jqueryUI) How can I turn autocomplete off?(jqueryUI) 如何关闭自动完成功能?
【发布时间】:2015-08-12 20:52:23
【问题描述】:

所以我正在尝试在 jquery 中重新创建 Facebooks 标记系统。我不能使用任何插件。我已经有了一些:

<html lang="de">

<head>
    <title>Autocomplete</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

    <script type="text/javascript">
      $(document).ready(function () {
          var triggered = false;
          var trigger = "@";
          var index = -1;

          $("input").autocomplete({
              source: [
                  "AAB",
                  "AAC",
                  "CCE",
                  "CCG",
                  "IIU",
                  "IIO"],
              search: function () {
                  if (!triggered) {
                      return false;
                  }
              },
              select: function (event, ui) {
                  var text = this.value;
                  var pos = text.lastIndexOf(trigger);

                  this.value = text.substring(0, pos + trigger.length) + ui.item.value;
                  triggered = false;
                  return false;
              },
              focus: function () {
                  return false;
              },
              minLength: 0
          }).on("keyup", function () {
              var text = this.value;
              var len = text.length;
              var last;
              var query;

              if (triggered) {
                  index = text.lastIndexOf(trigger);
                  query = text.substring(index + trigger.length);
                  $(this).autocomplete("search", query);

                  if (index === -1) {
                      triggered = false;
                  }
              } else if (len >= trigger.length) {
                  console.log("ELSE IF")
                  last = text.substring(len - trigger.length);
                  triggered = (last === trigger);
              }
          });
      });
    </script>
</head>

<body>
    <label>Input something here:</label>
    <br>
    <input type="text" value="" autofocus="true" />
</body>

</html>

所以我遇到了以下问题:标记工作正常,但在我点击 @ 后,一旦自动完成不会消失。它停止搜索,但仍显示未找到结果。我尝试如下解决:

  • 我尝试了自动完成中的“禁用”属性,导致它根本无法工作。
  • 我尝试了“destroy”方法,但导致我第一次后无法调用自动完成
  • 我尝试了导致显示“有 6 个元素”(我在此解释)的“禁用”方法
  • 最后我尝试了 close 方法,它完全没有任何作用。

所以我的问题:有没有人知道这如何工作的诀窍?我必须以某种方式重写我的代码吗?

【问题讨论】:

  • 你能分享一个小提琴吗?
  • @bloC 这是小提琴:jsfiddle.net/j1cLecwz/3
  • 你可以试试`$('#tags').autocomplete('close');`来关闭自动完成窗口。
  • @dreamweiver 正如我在最后一点中所说,这绝对没有任何作用,无论如何,谢谢

标签: javascript jquery facebook jquery-ui autocomplete


【解决方案1】:

这有点奇怪......但是在keyup事件中怎么样:

if(this.value == ""){
        triggered = false;
        $("input").autocomplete( "close" );
    }

See here

【讨论】:

  • 这有问题。整个系统的重点是我可以输入整个文本并在某处放一个@。在@之后我应该能够标记一个项目,如果我删除@而不是整个文本,自动完成应该关闭。谢谢你的帮助。
  • 所以您希望在您写完 @ 后立即打开自动完成功能?
  • 它已经完成了^^我希望它在我选择某些东西或删除@后完全关闭。由于某种原因在小提琴中起作用(显然小提琴不显示“无结果”部分)但不在我的编辑器中......
  • 好吧,那也许就是我没有得到你的原因......它在小提琴中对我来说很好......对不起,我尽力帮助你,但如果我不能在小提琴中模仿它很难找到解决方案:(
  • 刚发现stackoverflow.com/questions/4718968/… 或许你可以隐藏框无结果...
猜你喜欢
  • 1970-01-01
  • 2011-03-14
  • 1970-01-01
  • 2011-10-23
  • 1970-01-01
  • 2013-09-11
  • 2016-09-26
  • 2015-03-26
  • 1970-01-01
相关资源
最近更新 更多