Jquery 如何防止Twitter typeahead使用所选值填充输入？

我正在使用Twitter的typeahead插件进行文本输入的自动完成。我想改变这个行为，这样当点击时，它就不用把所选选项的值放到文本输入中，而是用它做其他事情

---

有没有办法防止typeahead自动用所选选项的值填充输入？

我尝试了所有其他方法，但在发布问题几分钟后偶然发现了一个解决方案

如果其他人需要这方面的帮助，添加typeahead:closed事件处理程序可以让您捕获输入的值，并在看到它之前将其从输入中清除。也许有一种方法可以防止它被输入到输入中，但我一直无法找到它

下面是我正在做的：

      $("#input").typeahead({
            highlight: true
        },
        {
            name: 'my-dataset',
            displayKey: 'value',
            source: bloodHound.ttAdapter()
        }
    ).on('typeahead:closed', function (obj, datum, name) {
          $(obj.currentTarget).val("");
      });

---

虽然不一定是typeahead的意图，但如果你把它用于搜索页面，我觉得这个小花边会非常有用，因为我自己也在寻找这个答案

从Typeahead结果列表中取消绑定选择事件：

你做了什么 -当typeahead对象打开时，我们只需完全解除选择操作的绑定，以便在不关闭它的情况下执行我们希望它执行的操作

进一步说明： 这有点破坏性，但是如果你在搜索页面上使用，比如说，结果项的主体链接到一个配置文件，右键单击一个follow按钮，那么自动填充是一个非常麻烦的问题

---

希望这有帮助！知道这有点晚了，但可能以后会有其他人在寻找它。

为此挣扎了一段时间，直到我发现如何在选择选项时清除文本：

$("#typeahead-input").on('typeahead:selected', function (event, datum, name) {
   $(this).typeahead("val", "");
   // Do something with the datum...
});

与答案相同，除了在版本中，该事件称为typeahead:close而不是typeahead:closed，唯一的参数是事件：

$("#input").typeahead(
    // ...
)
.on('typeahead:close', function (evt) {
    console.log(evt);
    $(obj.currentTarget).val("");
});

---

有几种方法可以用所选值填充输入：

用鼠标单击建议 按“tab”键自动完成最上面的建议 使用光标键在建议列表中移动 首先处理1和2，您可以处理相应的before事件：

方法3有点棘手。存在beforecursorchange事件，但如果取消该事件，则无法在菜单中移动。这可能不是你想要的

我发现处理此问题的最简单方法是替换typeahead的输入对象上的setInputValue方法，并防止设置该值：

// get the actual typeahead instance 
let typeahead = $('#the-typeahead').data('ttTypeahead'); 

// capture the existing method
let old = typeahead.input.setInputValue;

typeahead.input.setInputValue = function setInputValue(value) {
    // Allow clearing the input
    if (value === '') {
        old.call(typeahead.input, value);
    }
}

替换此方法将停止输入值由库设置，所以您需要考虑是否真的要这么做。在上面的例子中，我允许清除输入仍然有效，因为这对我很有用。使用这种方法，您不需要费心处理beforeselect和BeforeAutomplete事件

如果替换setInputValue方法太多，可以替换typeahead实例上的moveCursor函数，但这意味着要重新实现更多的代码。在这种情况下，您还需要处理beforeselect和BeforeAutomplete事件

---

不管怎样，替换内部方法都不太好，但鉴于项目实际上已被放弃，这并不是什么大问题。

好主意，我还没有尝试过，但它看起来会奏效。

$('#the-typeahead').on('typeahead:beforeselect', function ($event, suggestion) {
    // do whatever with the suggestion
    // then either call $event.preventDefault(), or return false to cancel the event
    return false;
})

// get the actual typeahead instance 
let typeahead = $('#the-typeahead').data('ttTypeahead'); 

// capture the existing method
let old = typeahead.input.setInputValue;

typeahead.input.setInputValue = function setInputValue(value) {
    // Allow clearing the input
    if (value === '') {
        old.call(typeahead.input, value);
    }
}