Javascript 触发“；精选；typeahead.js中的事件

我使用的是typeahead.js vs.0.9.3，并使用

local

填充

数据集

我正在将函数绑定到
typeahead:selected
和
typeahead:autocompleted
事件，以便可以使用所选typeahead数据中的信息填充表单中的一些其他隐藏输入字段

<form id="customer-form" action="/customer-form" method="post">
    <input type="text" name="customer-typeahead" placeholder="Customer name" id="customer-typeahead"/>

    <input type="hidden" name="customer-id" id="customer-id"/>
    <input type="hidden" name="customer-name" id="customer-name"/>   
</form>

我将大部分内容用于以下jquery：

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="../js/typeahead.min.js" type="text/javascript"></script>
<script src="../js/hogan.js" type="text/javascript"></script>
<script>

$(document).ready(function() {

    var typeahead_template = [
            '<div style="width: 190px; float:left;">{{value}}</div>',
            '<div style="float:right;">{{id}}</div>'
            ].join('')

    function changeTypeahead(obj, datum) {
            $('input#customer-id').val(datum.id);
            $('input#customer-name').val(datum.value);
    };

    $('#customer-typeahead').typeahead({
        local: [{"value": "Andrew", "id": "1"}, {"value": "Bryan", "id": "2"}, {"value": "Cathy", "id": "3"} ],
        limit: 5,
        template: typeahead_template,
        engine: Hogan
    }).bind('typeahead:selected', function(obj, datum) {
        changeTypeahead(obj, datum);
    }).bind('typeahead:autocompleted', function(obj, datum) {
        changeTypeahead(obj, datum);
    });

    $(".copy-data").click(function(){
        id = $(this).find(".customer-id").text();
        name = $(this).find(".customer-name").text();

        $("#customer-typeahead").typeahead('setQuery', name)
        $("#customer-typeahead").trigger('selected');
    });
});

</script>


$（文档）.ready（函数（）{
var typeahead_模板=[
“{{value}}”，
“{{id}}”
].加入（“”）
功能转换类型前进（obj，基准）{
$（'input#customer id'）.val（datum.id）；
$（'input#customer name'）.val（datum.value）；
};
$（“#客户类型前进”）。类型前进({
本地：[{“值”：“安德鲁”，“id”：“1”}，{“值”：“布莱恩”，“id”：“2”}，{“值”：“凯西”，“id”：“3”}]，
限额：5，
模板：typeahead_模板，
引擎：霍根
}).bind（'typeahead:selected'，函数（对象，基准）{
向前转换（obj，基准）；
}).bind（'typeahead:autocompleted'，函数（obj，datum）{
向前转换（obj，基准）；
});
$（“.copy data”）。单击（函数（）{
id=$（this.find（“.customer id”）.text（）；
name=$（this.find（“.customer name”）.text（）；
$（“#customer typeahead”）.typeahead（'setQuery'，name）
$（“#客户类型先行”）.trigger（'selected'）；
});
});

当用户单击
.copy data
div
时，相应的
客户名称将填充输入文本框，但不会填充隐藏的输入。我打算以某种方式触发
typeahead:selected
事件，该事件将适当的
数据传递给
changetypehead
函数，但这似乎没有发生

有没有办法这样利用typeahead及其数据集的本机功能，或者我必须直接设置隐藏的输入

更新：为了澄清，我设想使用
setQuery
会导致typeahead自行“触发”，即匹配查询，自行从数据集确定适当的数据，并触发所有适当的事件。如果可以避免，我宁愿不必从typeahead数据集外部重新创建整个数据对象
您似乎忘记将
数据
传递给您选择的
触发器作为第二个参数。尝试以下方法：

$("#customer-typeahead").trigger('selected', {"id": id, "value": value});

请参见
您似乎忘记将
数据
作为第二个参数传递给您选择的
触发器。尝试以下方法：

$("#customer-typeahead").trigger('selected', {"id": id, "value": value});

请参见
我澄清了这个问题，以便将重点放在我正试图更准确地做的事情上，但我肯定会尝试将此作为一个备用选项。关于更新有什么想法吗？您可以尝试向typeahead发送
按键
（或者
提交
）事件，希望触发
自动完成
回调。但似乎无法保证您的
.copy data
div的内容与typeahead数据一致，或者如果您不给它ID，typeahead搜索将仅基于名称找到正确的匹配项。为什么不直接调用您自己的
changeTypehead
函数呢？这正是我尝试的<代码>按键
未触发
自动完成
回调。我想避免调用
changetypeaward
，因为在我的实际情况中，每个数据中都有更多的信息，我想避免在
中包含所有这些信息。如果可能的话，复制data
div的内容，并且还必须扩展所有这些js函数。这是必要的-谢谢你的帮助，我澄清了问题，把重点放在我想做的事情上，但我肯定会把它作为一个备用选项来尝试。关于更新有什么想法吗？您可以尝试向typeahead发送
按键
（或者
提交
）事件，希望触发
自动完成
回调。但似乎无法保证您的
.copy data
div的内容与typeahead数据一致，或者如果您不给它ID，typeahead搜索将仅基于名称找到正确的匹配项。为什么不直接调用您自己的
changeTypehead
函数呢？这正是我尝试的<代码>按键
未触发
自动完成
回调。我想避免调用
changetypeaward
，因为在我的实际情况中，每个数据中都有更多的信息，我想避免在
中包含所有这些信息。如果可能的话，复制data
div的内容，并且还必须扩展所有这些js函数。这是必要的，谢谢你的帮助