Question

如何获取基金会框架webapp的搜索建议？如果它是用于bootstrap我可以使用typeahead等，但这是一个基础框架网站，包括bootstrap js和css导致与基础css和js冲突。

如何获得基金会网站的搜索建议（类似于引导程序的typeahead）

Answer 1

根据这个article，可以使用jQuery在Zurb Foundation中实现自动完成搜索：

<script>
  document.write('<script src=' +
    ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') + '.js><\/script>')
</script>
<script src="js/foundation.min.js"></script>

HTML：

<div class="row">
  <div class="large-12 columns ui-widget">
  <label for="tags">Input Label</label>
  <input id="tags" type="text" placeholder="large-12.columns">
  </div>
</div>

JS：

<script>
  $(function() {
    var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
    ];
$( "#tags" ).autocomplete({
      source: availableTags
      });
});
</script>

此外，请记住，Proto.js和Jquery.js后备脚本绝对是关键。此外，foundation.min.js包含Jquery库本身。

如何获得基金会框架webapp的搜索建议？

1 个答案: