Javascript 更改Twitter Typeahead返回的内容

是否可以更改Twitter返回的类型

这样用户可以在文本字段中搜索名称，但它返回与所选结果对应的ID

我没有找到任何关于这个的东西，我甚至搜索了源代码

提前谢谢

$(document).ready(function(){
    var modules = getBloodhound('modules');

    $('.typeahead').typeahead({
        hint: true,
        highlight: true,
        minLength: 1
    },
    {
        name: 'id',
        displayKey: 'name',
        source: modules
    });
});

var getBloodhound = function(name){
    return new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.whitespace,
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        remote: {
            url: '/json/' + name + '/%QUERY',
            wildcard: '%QUERY'
        }
    });
}

编辑，更新

如果正确解释问题，则返回的数组包含具有

name

和

id

属性的对象。要求是将

input

元素中显示的

hint

设置为返回对象的

id

，而不是

name

，这将在建议结果中呈现

您可以使用

模板

，

建议

功能设置

.tt提示

输入

，显示

提示

至

id

的值；设置

.tt hint

占位符

属性，该属性在

建议

选项处显示对象参数的

提示

使用

typeahead:render

，

input

事件来设置

css

的

属性，或者

占位符

在

处如果没有
值
则设置空字符串。typeahead

var getBloodhound = function(name){
      return new Bloodhound({
        datumTokenizer: Bloodhound.tokenizers.whitespace("value"),
        queryTokenizer: Bloodhound.tokenizers.whitespace,
        remote: {
            url: '/json/' + name + '/%QUERY',
            wildcard: '%QUERY'
        }
      });
}

var modules = getBloodhound('modules').ttAdapter();

$(".typeahead").typeahead({
    hint: true,
    minLength: 1,
    highlight: true
  }, {
    name: "id",
    display: "value",
    source: modules,
    templates: {
      suggestion: function(data) {
        return "<li>" + data.team + "</li>"
      }
    }
  })
  .on("typeahead:render", function(e, data) {
    console.log(e, data);
    $(".tt-hint").attr("placeholder", data.id)
    .css("left", e.target.value.length * 10)
  })
  .on("input", function() {
    if (this.value === "" || /^\s+$/.test(this.value)) {
      $(".tt-hint").attr("placeholder", "")
    }
  })

var getBloodhound=函数（名称）{
回归新警犬({
datumTokenizer:Bloodhound.tokenizer.whitespace（“value”），
queryTokenizer:猎犬，标记，空白，
远程：{
url:'/json/'+name+'/%QUERY'，
通配符：'%QUERY'
}
});
}
var modules=getBloodhound（'modules'）.ttAdapter（）；
$（“.typeahead”）.typeahead({
提示：没错，
最小长度：1，
推荐理由：没错
}, {
姓名：“id”，
显示：“值”，
资料来源：模块，
模板：{
建议：功能（数据）{
返回“
”+data.team+”
“
}
}
})
.on（“输入：呈现”，函数（e，数据）{
控制台日志（e，数据）；
$（“.tt hint”）.attr（“占位符”，data.id）
.css（“左”，e.target.value.length*10）
})
.on（“输入”，函数（）{
if（this.value==“”| |/^\s+$/.test（this.value））{
$（“.tt-hint”）.attr（“占位符”，“占位符”）
}
})

var nflTeams=新猎犬({
datumTokenizer:Bloodhound.tokenizers.obj.whitespace（“团队”），
queryTokenizer:猎犬，标记，空白，
本地：[{
“团队”：“旧金山49人队”，
“id”：“49人”
}, {
“团队”：“芝加哥熊队”，
“id”：“熊”
}, {
“团队”：“辛辛那提孟加拉人”，
“id”：“孟加拉人”
}, {
“团队”：“水牛比尔”，
“id”：“账单”
}, {
“团队”：“丹佛野马队”，
“id”：“野马”
}, {
“团队”：“克利夫兰布朗”，
“id”：“布朗”
}, {
“团队”：“坦帕湾海盗队”，
“id”：“海盗”
}, {
“团队”：“亚利桑那红雀队”，
“id”：“红衣主教”
}, {
“团队”：“圣地亚哥充电器”，
“id”：“充电器”
}, {
“团队”：“堪萨斯城酋长”，
“id”：“酋长”
}, {
“团队”：“印第安纳波利斯小马队”，
“id”：“小马”
}, {
“团队”：“达拉斯牛仔队”，
“id”：“牛仔”
}, {
“团队”：“迈阿密海豚”，
“id”：“海豚”
}, {
“团队”：“费城鹰队”，
“id”：“鹰”
}, {
“团队”：“亚特兰大猎鹰队”，
“id”：“猎鹰”
}, {
“团队”：“纽约巨人”，
“id”：“巨人”
}, {
“团队”：“杰克逊维尔美洲虎”，
“id”：“美洲虎”
}, {
“团队”：“纽约喷气机”，
“id”：“喷气式飞机”
}, {
“团队”：“底特律狮队”，
id:“狮子”
}, {
“团队”：“绿湾包装工”，
“id”：“包装工”
}, {
“团队”：“卡罗莱纳黑豹”，
“id”：“黑豹”
}, {
“团队”：“新英格兰爱国者”，
“id”：“爱国者”
}, {
“团队”：“奥克兰袭击者”，
“id”：“袭击者”
}, {
“团队”：“圣路易斯公羊队”，
“id”：“Rams”
}, {
“团队”：“巴尔的摩乌鸦”，
“id”：“乌鸦”
}, {
“团队”：“华盛顿红人队”，
“id”：“红人”
}, {
“团队”：“新奥尔良圣徒”，
“id”：“圣人”
}, {
“团队”：“西雅图海鹰队”，
“id”：“海鹰”
}, {
“团队”：“匹兹堡钢人队”，
“id”：“钢人”
}, {
“团队”：“休斯顿德克萨斯人”，
“id”：“德克萨斯人”
}, {
“团队”：“田纳西泰坦”，
“id”：“泰坦”
}, {
“团队”：“明尼苏达维京人”，
“id”：“维京人”
}]
})
var adapter=nflTeams.ttAdapter（）；
$（“#默认建议.typeahead”）.typeahead({
提示：没错，
最小长度：1，
推荐理由：没错
}, {
名称：“nfl球队”，
显示：“值”，
来源：适配器，
模板：{
建议：功能（数据）{
返回“
”+data.team+”
“
}
}
})
.on（“输入：呈现”，函数（e，数据）{
控制台日志（e，数据）；
$（“.tt hint”）.attr（“占位符”，data.id）
.css（“左”，“计算”（+e.target.value.length*7+“px”）
})
.on（“输入”，函数（）{
if（this.value==“”| |/^\s+$/.test（this.value））{
$（“.tt-hint”）.attr（“占位符”，“占位符”）
}
})

你能在问题中加入

js

吗？看看这是否有帮助，非常感谢！正是我需要的！它似乎不起作用。我在函数中添加了一个console.log，它确实输出了正确的信息，但不再提供任何建议，只是一个空白列表。可能是一个不同的键而不是“value”？更详细地说，我希望它显示JSON中返回的

name

键，但是提交

id

键，这可能吗？@NathanPrins您应该能够将

return{value:results.name}

替换为

return{value:results.id}

，但是，问题是，当我添加过滤器或转换时，它不再在输入字段中为我提供建议，它只是一个空白列表。非常感谢您的帮助和努力，它现在正在工作！：）