2015-04-04 41 views
2
<script type="text/javascript"> 
$(document).ready(function(){ 
     $('input').typeahead({ 
      name: 'accounts', 
      local: []//here my data 

     }); 
    }); 
</script> 



<title>Search Service</title> 
</head> 
<body style="background-color: black; color: white;"> 

    <div class="container"> 
     <div class="col-lg-12" style="height: 100px;">&nbsp;</div> 

     <div class="col-lg-12"> 
      <div class="col-lg-2"></div> 
      <div class="col-lg-8"> 
       <section class="webdesigntuts-workshop"> 
        <form action="" method="">   
         <input type="search" placeholder="Search..."> 
         <input type="text" id="service" placeholder="Services" autocomplete="off">    
         <button>Search</button> 
        </form> 
       </section>  
      </div> 
      <div class="col-lg-2"></div> 
     </div> 
    </div> 


</body> 
</html> 

這是我簡單的示例代碼。我已經爲腳本加載添加了bootstrap.min.js和typeahead.js。它們都在瀏覽器中正確加載。但提前引導類型不起作用。引導類型前面不起作用

+0

你使用的是什麼版本的Bootstrap?你正在使用什麼版本的Typeahead? – cfnerd 2015-05-18 21:18:39

回答

8

您可能已經想出了一個解決方案,但我的建議是使用此替代方案代替此Bootstrap-3-Typeahead。使用和理解更簡單。使用該插件時,在我的環境下面的工作:

的HTML

<input type="search" placeholder="Search..." data-provide="typeahead" /> 
<input type="text" id="service" placeholder="Services" autocomplete="off" data-provide="typeahead" /> 

的JS:

$(document).ready(function(){ 
    $("input").typeahead({ 
     source: ['Amsterdam', 'Washington', 'Sydney', 'Beijing', 'Cairo'] 
     , minLength: 2 
    }); 
}); 

希望這有助於。