Javascript 推特类型区分事件

我正在设计一个系统，允许用户使用字符串或词汇表中的术语对元素进行注释。我使用TwitterTypeahead进行自动补全，并想区分输入的字符串和术语

我不知道如何区分以下情况：

用户在给出自己的值后按enter键

用户按下向下（或向上）箭头（从而选择自动完成选项）并按enter键

我编写的事件侦听器：

$("#itemInp").on('typeahead:select', function(event, term) {
    console.log("save: term", term);
});

$("#itemInp").on('keyup', function(event) {
    if(event.which == 13) {
        var string = $("#itemInp").val();
        console.log("save: string", string);
    }
});

使用以下HTML：

<input id="itemInp"><input>

第一个侦听器捕获所有选定的typeahead术语，允许正确保存术语。问题是，如果用户按下enter键并选择一个typeahead术语，第二个侦听器也会被触发，该术语现在也保存为普通字符串。如果选择了typeahead建议，是否有办法不触发第二个侦听器

加载代码的小提琴：

编辑： 我考虑过很多黑客，但都有自己的问题：

通过添加自定义的Typeahead display，在选择输入时向输入中显示的字符串添加特殊字符： 这会导致引入一个附加字符，如果用户在不按enter键的情况下按下向下箭头，则会很麻烦

尝试对侦听器进行排序，首先使用术语listener trigger，将布尔值设置为true，然后在第二个侦听器中对该布尔值进行筛选。不喜欢这种过滤方式，因为它会引入延迟

@peter子句提供的解决方案，检查所选值是否在可用项列表中。但是，这样我就无法跟踪用户是打算使用自动完成选项来选择一个术语，还是显式地添加一个普通字符串

---

这是一个相当粗糙的解决方案，但您可以检查所选值是否在可用项列表中

if (states.indexOf(string) == -1) {
    //...
}

---

参见

我也有类似的问题。我就是这样解决的

    var wasSelected = false;
    $("#itemInp").on('typeahead:select', function(event, term) {
        wasSelected = true;
        console.log("save: term", term);
    });

    $("#itemInp").on('change', function(event) {
        if(!wasSelected) {
            var string = $("#itemInp").val();
            console.log("save: string", string);
        }
        wasSelected = false;    
    });

---

感谢您的回复，但这样我就无法跟踪用户是打算使用自动完成选项来选择术语还是显式添加普通字符串。我简化了这个示例，应用程序使用一个链接了URI的typeahead来消除所选术语的歧义。例如，如果有人键入Alabama，而不按向上或向下选择typeahead建议，我会将其保存为一个术语，而它应该保存为一个普通字符串。谢谢，帮助我解决这个问题的主要原因是认识到触发侦听器的顺序不会改变。我的解决方案更具体于实现，当使用typeahead时，我会清除第一个侦听器中的输入字段。如果第二个侦听器随后遇到一个字段，则它假定没有为此情况提供任何输入。