具有预类型处理程序的多个文本字段未执行 AJAX 调用



在我提出问题之前,我将说明我正在使用的一些工具:

  • jquery-1.11.0.js
  • 引导程序 v3.1.1
  • 修改后的引导类型提前.js

我有一个预选类型,只需一个文本字段即可出色地运行。但是,当我添加另一个文本字段并尝试将 typehead 处理程序挂接到第二个时,第二个无法执行 AJAX 调用,我正在拔头发试图找出问题所在。

网页代码:

<div id = "tester" class="well">
<input id = "test" class="typeahead" type="text" placeholder="Search" data-provide="typeahead" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top;">
</div>
<div id = "tester2" class="well">
<input id = "test2" class="typeahead" type="text" placeholder="Search" data-provide="typeahead" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top;">
</div>

Javascript:

<script src="assets/js/jquery-1.11.0.js"></script>
<script src="assets/js/bootstrap.js"></script>
<script>
$(function(){
$('.typeahead').typeahead({
    source: function(typeahead, query){
        $.ajax({
            url: 'my_controller',
            type: 'POST',
            data: 'query=' + query,
            dataType: 'JSON',
            async: true,
            success: function(data){
                typeahead.process(data);
            }
        });
    }
});
});
</script>

AJAX 调用甚至无法使用第二个提前类型执行,因为第一个类型工作正常。我不知道我错过了什么。我什至通过类名选择输入。

我将非常感谢任何帮助或指导。

这是一个jsfiddle:http://jsfiddle.net/pK6g5/

谢谢。

你的"修改后的bootstrap-typeahead.js"库使用$.browser,自1.9以来不在jQuery中。要保留它,您可以添加Jquery Migrate。

我刚刚将库添加到您的小提琴中,它似乎有效:小提琴

最新更新