Typeahead不能使用Jquery keyUp函数

时间:2015-02-11 12:50:10

标签: jquery twitter-bootstrap typeahead.js bootstrap-typeahead

我是typeahead.js的新手并使用bootstrap搜索框进行自动完成....当我想在document.ready上加载数据(option1,option2..etc)时,我的jquery工作正常。这是以下代码......

$(function() {
            function displayResult(item) {
                $('.alert').show().html('You selected <strong>' + item.value + '</strong>: <strong>' + item.text + '</strong>');
            }

            $(document).ready(function() {
                    $.ajax({
                               type: 'GET',
                               url:'QuickSearch?City='+"Bengaluru",
                               dataType: 'json',
                               success: function(data){
                                   var j=jQuery.parseJSON(data.jsonAreaList);
                                   var cool=j;
                                 $('#demo1').typeahead({
                                     source: j,
                                    onSelect: displayResult
                                });

                                       },
                                       error: function(data) 
                                       {//When fails to load the Areas.

                                       }
                            });
                            return false;
                  }); 

所有区域都正确加载....现在我的要求是我不想在document.onready上加载区域....喜欢从用户那里获取查询并将结果设置为typeahead textbox ..... here是我正在尝试的

$(function() {
            function displayResult(item) {
                $('.alert').show().html('You selected <strong>' + item.value + '</strong>: <strong>' + item.text + '</strong>');
            }

            $(document).ready(function() {
             $("#SearchBox").keyup(function() {
                 var city=$("#SearchBox").val();
                    $.ajax({
                               type: 'GET',
                               url:'QuickSearch?City='+city,
                               dataType: 'json',
                               success: function(data){
                                   var j=jQuery.parseJSON(data.jsonAreaList);
                                   var cool=j;
                                 $('#demo1').typeahead({
                                     source: j,
                                    onSelect: displayResult
                                });

                                       },
                                       error: function(data) 
                                       {//When fails to load the Areas.

                                       }
                            });
                            return false;
                  });
    });
});

我不知道我做错了什么...... :(

1 个答案:

答案 0 :(得分:0)

你的url ajax调用中的查询字符串是错误的。

尝试:

url:'QuickSearch?City='+city; //you have a typo in your code