Javascript 选择typeahead建议/使用tab键自动完成时，如何绑定自定义函数？_Javascript_Jquery_Twitter Typeahead

Javascript 选择typeahead建议/使用tab键自动完成时，如何绑定自定义函数？

javascript jquery

Javascript 选择typeahead建议/使用tab键自动完成时，如何绑定自定义函数？,javascript,jquery,twitter-typeahead,Javascript,Jquery,Twitter Typeahead,我正在使用这个jQuery插件，允许从Google获得建议，如中所示。（我使用的插件没有显示地图）当用户从建议的结果列表中选择一个元素时，我成功地使用了插件的事件但是当用户使用Tab选择建议的（“typeaheaded”）条目时，我没有成功绑定自定义函数。（使用该插件的typeahead版本的要点）更新：在（2）中，我成功地触发了正确的事件，但没有正确的结果，请参见末尾以下是我尝试过的： <html> <head> <title&g

我正在使用这个jQuery插件，允许从Google获得建议，如中所示。（我使用的插件没有显示地图）

当用户从建议的结果列表中选择一个元素时，我成功地使用了插件的事件

但是当用户使用Tab选择建议的（“typeaheaded”）条目时，我没有成功绑定自定义函数。（使用该插件的typeahead版本的要点）

更新：在（2）中，我成功地触发了正确的事件，但没有正确的结果，请参见末尾

以下是我尝试过的：

<html>
    <head>
        <title>Exemple</title>
    </head>
    <body>
        <input type="text" id="address" />
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
        <script src="jquery-2.0.2.min.js"></script>
        <script src="typeahead.bundle.min.js"></script>
        <script src="typeahead-addresspicker.min.js"></script>
        <script type="text/javascript"> 
            $(document).ready(function ()
            {
                var addressPicker = new AddressPicker();
                $('#address').typeahead({
                    highlight: true
                }, {
                    displayKey: 'description',
                    source: addressPicker.ttAdapter()
                });

                //Works, planned in the plugin
                $(addressPicker).on('addresspicker:selected', function (event, result) {
                    setResults(result);
                });

                //Doesn't work
                $(addressPicker).on('typeahead:selected', function (event, result) {
                    setResults(result);
                });

                //(1) Doesn't work too
                $(addressPicker).on('typeahead:autocomplete', function (event, result) {
                    setResults(result);
                });


                $('#address').on('typeahead:autocomplete', function (event, result) {
                    setResults(result);
                });

                //(2) This almost works, I've got the event fired, but no luck running correctly setResult with it
                function setResults(result) {
                    console.log(result);
                    var premise = result.nameForType("premise"); //(3)
                    console.log(premise);
                }
            }
        </script>       
    </body>
</html>

我成功地通过选项卡在建议的自动完成上捕获了事件，而不必从按键关闭事件截获它

现在我只需要让它为

（2）当事件被正确触发时，返回的结果与

addresspicker:selected

事件的结果不同，并且留置权（3）返回此错误：

TypeError:result.nameForType不是函数

我知道

typeahed:autocomplete

事件返回的对象类型不是预期的类型，这证明了错误

我现在正在搜索如何获取正确的对象类型，以及如何将其传递给

地址选择器

如果您愿意将绑定移动到文档（或实际上任何高于地址选择器的元素），那么您也将能够捕获typeahead事件

这些都应该仍然有效：

$(document).on('addresspicker:selected', function (event, result) { setResults(result);});

$(document).on('typeahead:selected', function (event, result) { setResults(result); });

$(document).on('typeahead:autocomplete', function (event, result) { setResults(result); });

如果您愿意将绑定移动到文档（或者实际上移动到高于addressPicker的任何元素），那么您也可以捕获typeahead事件

这些都应该仍然有效：

$(document).on('addresspicker:selected', function (event, result) { setResults(result);});

$(document).on('typeahead:selected', function (event, result) { setResults(result); });

$(document).on('typeahead:autocomplete', function (event, result) { setResults(result); });

我最终通过添加此代码（通常用于更新映射）使其工作，但即使我使用不带映射的地址选择器，它也会使用正确的结果类型触发正确的事件：

$('#address').bind("typeahead:autocompleted", addressPicker.updateMap);

如果有人有一个合适的方法来达到同样的效果，我就要了

我最终通过添加此代码（通常用于更新映射）使其工作，但即使我使用不带映射的地址选择器，它也会使用正确的结果类型触发正确的事件：

$('#address').bind("typeahead:autocompleted", addressPicker.updateMap);

如果有人有一个合适的方法来达到同样的效果，我就要了

是否有理由将侦听器绑定到addressPicker而不是文档？地址选择器不会“听到”一个

typeahead:selected

事件或一个

typeahead:autocomplete

事件。但是文件会的。不，只是我的一个错误/误解。。。让我试试你的建议，我会回来问你：）你为什么要将侦听器绑定到地址选择器而不是文档？地址选择器不会“听到”一个

typeahead:selected

事件或一个

typeahead:autocomplete

事件。但是文件会的。不，只是我的一个错误/误解。。。让我试试你的建议，我会回到你身边：）我试过你的建议，但没用。即使是第一个，也要替换工作的

$（addressPicker）.on（'addressPicker:selected'，function（event，result）{setResults（result）；}）由$（文档）.on（'addresspicker:selected'，函数（事件，结果）{setResults（结果）；}）失败了。我必须仔细查看github for addresspicker，因为该行为似乎与默认的typeahead行为不一致。我尝试了你的建议，但没有奏效。即使是第一个，也要替换工作的$（addressPicker）.on（'addressPicker:selected'，function（event，result）{setResults（result）；}）由$（文档）.on（'addresspicker:selected'，函数（事件，结果）{setResults（结果）；}）失败了。我必须仔细查看github for addresspicker，因为该行为似乎与默认的typeahead行为不一致。事件绑定对我来说似乎是正确的方法！：）事件绑定对我来说似乎是合适的方法！：）