基本 typeahead.js 不起作用? [英] basic typeahead.js not working?

查看:34
本文介绍了基本 typeahead.js 不起作用?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

经过数小时的研究和编辑代码后,我一直在问这个问题,我想实现 typehead.js 以实现自动完成,但它不起作用我将非常感谢如果有人能帮我解决这个问题...

<div class="input-group"><div id="the-basics"><input class="typeahead" type="text" placeholder="美国各州">

<脚本>$(document).ready(function () {var substringMatcher = function(strs) {返回函数 findMatches(q, cb) {var 匹配,substringRegex;//将填充子字符串匹配的数组匹配 = [];//用于确定字符串是否包含子字符串`q`的正则表达式substrRegex = new RegExp(q, 'i');//遍历字符串池和任何字符串//包含子字符串 `q`,将其添加到 `matches` 数组$.each(strs, function(i, str) {如果(substrRegex.test(str)){匹配.推(str);}});cb(匹配);};};var states = ['阿拉巴马州', '阿拉斯加州', '亚利桑那州', '阿肯色州', '加利福尼亚州',科罗拉多"、康涅狄格"、特拉华"、佛罗里达"、乔治亚"、夏威夷"、'爱达荷州'、'伊利诺伊州'、'印第安纳州'、'爱荷华州'、'堪萨斯州'、'肯塔基州'、'路易斯安那州'、缅因州"、马里兰州"、马萨诸塞州"、密歇根州"、明尼苏达州"、密西西比"、密苏里"、蒙大拿"、内布拉斯加州"、内华达"、新罕布什尔"、新泽西"、新墨西哥"、纽约"、北卡罗来纳"、北达科他"、俄亥俄州"、俄克拉荷马州"、俄勒冈州"、宾夕法尼亚州"、罗德岛州"、南卡罗来纳州"、南达科他州"、田纳西州"、德克萨斯州"、犹他州"、佛蒙特州"、弗吉尼亚"、华盛顿"、西弗吉尼亚"、威斯康星"、怀俄明"];$('#the-basics .typeahead').typeahead({提示:真实,亮点:真实,最小长度:1},{name: '状态',来源:substringMatcher(states)});}<!--<span class="input-group-addon info"><span class="glyphicon glyphicon-asterisk"></span></span>--></div></div>

解决方案

问题可能在于,如果您使用的是 Bootstrap 3.x.x,其中删除了 typeahead.

您可以使用 Twitter typeahead.js 库.有一篇关于它的不错的博客文章(最后也是关于简单集成的):https://blog.twitter.com/2013/twitter-typeaheadjs-you-autocomplete-me

更新

github 上也有 projexct,它在 Bootstrap 中提供了 back typeahead:https://github.com/bassjobsen/Bootstrap-3-Typeahead

i have been asking this after all the research and editing the code for hours,i want to implement the typehead.js to implement autocomplete but its not working i will be very thankfull if anyone can help me with this...

<div class="form-group">
            <div class="input-group">
                <div id="the-basics">
    <input class="typeahead" type="text" placeholder="States of USA">
                </div>
                <script>

  $(document).ready(function () {
var substringMatcher = function(strs) {
  return function findMatches(q, cb) {
    var matches, substringRegex;

    // an array that will be populated with substring matches
    matches = [];

    // regex used to determine if a string contains the substring `q`
    substrRegex = new RegExp(q, 'i');

    // iterate through the pool of strings and for any string that
    // contains the substring `q`, add it to the `matches` array
    $.each(strs, function(i, str) {
      if (substrRegex.test(str)) {
        matches.push(str);
      }
    });

    cb(matches);
  };
};

var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
  'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
  'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
  'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
  'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
  'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
  'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
  'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
  'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
];

$('#the-basics .typeahead').typeahead({
  hint: true,
  highlight: true,
  minLength: 1
},
{
  name: 'states',
  source: substringMatcher(states)
});
}
</script>

                <!--<span class="input-group-addon info"><span class="glyphicon glyphicon-asterisk"></span></span>-->
            </div></div>

解决方案

The problem may be that if you are using Bootstrap 3.x.x in which typeahead was removed.

You can use Twitter typeahead.js library. There is a nice blog post about it (in the end also about simple integration): https://blog.twitter.com/2013/twitter-typeaheadjs-you-autocomplete-me

Update

There is also projexct on github which provides back typeahead in Bootstrap: https://github.com/bassjobsen/Bootstrap-3-Typeahead

这篇关于基本 typeahead.js 不起作用?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆