2015-04-27 106 views
0

不知道为什么我无法让这个模块工作,taginput工作正常。但是这个类型不是出于某种原因。我使用Twitter预输入: https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.jstagsinput typeahead not working

<html> 
<head> 
    <!-- Latest compiled and minified CSS --> 
    <link rel="stylesheet" href="css/bootstrap.min.css"> 

    <!-- Optional theme --> 
    <link rel="stylesheet" href="css/bootstrap-theme.min.css"> 

    <!-- Tagsinput --> 
    <link rel="stylesheet" href="tagsinput/bootstrap-tagsinput.css"> 

</head> 

<body> 
    <input value="Amsterdam,Washington" type="text" data-role="tagsinput"> 

    <script> 
     var bestPictures = new Bloodhound({ 
      datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 
      queryTokenizer: Bloodhound.tokenizers.whitespace, 
      prefetch: 'tagsinput/cities.json', 
     }); 

     $('input').typeahead(null, { 
      name: 'best-pictures', 
      display: 'value', 
      source: bestPictures 
     }); 
    </script> 

    <!-- Latest compiled and minified JavaScript --> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 
    <script src="tagsinput/bootstrap-tagsinput.js"></script> 
    <script src="tagsinput/typeahead.bundle.js"></script> 
</body> 
</html> 

JSON文件:

[ "Amsterdam", 
    "London", 
    "Paris", 
    "Washington", 
    "New York", 
    "Los Angeles", 
    "Sydney", 
    "Melbourne", 
    "Canberra", 
    "Beijing", 
    "New Delhi", 
    "Kathmandu", 
    "Cairo", 
    "Cape Town", 
    "Kinshasa" 
] 

回答

0

这可能是与您的标签输入配置的问题。

var bestPictures = new Bloodhound({ 
     datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 
     queryTokenizer: Bloodhound.tokenizers.whitespace, 
     prefetch: 'tagsinput/cities.json', 
    }); 

    $('input').tagsinput({ 
     typeaheadjs: [null, { 
     name: 'best-pictures', 
     display: 'value', 
     source: bestPictures 
     }] 
    }); 

反正你可以尝试通过标签输入插件设置预输入叽叽喳喳