动态加载jQuery，然后加载Typeahead.js

我正在尝试动态加载jQuery，然后动态加载Typeahead.js jQuery插件 .

我能够加载jQuery，但是typeahead插件似乎没有加载 . 代码的第一部分检查jQuery，如果它不存在则动态加载它 .

加载jQuery之后，我试图使用$ .getScript加载Typeahead，它在jQuery文档中用来加载jQuery插件 . 但是，当我尝试调用Bloodhound（Typeahead中的建议引擎）时，Typehead插件似乎没有加载，因为我遇到错误 .

我确认下面显示的预先输入代码的工作原理是把它扔进Rails应用程序 . 当与jquery-rails gem和资产管道一起使用时，typeahead代码使用JSON响应正确填充我的输入框 . 但是，我不能依赖Rails，当我尝试分离代码时，我无法以正确的顺序动态加载库 .

任何帮助将不胜感激 .

(function() {

    // Localize jQuery variable
    var jQuery;

    /******** Load jQuery if not present *********/
    if (window.jQuery === undefined) {
      var script_tag = document.createElement('script');
      script_tag.setAttribute("type","text/javascript");
      script_tag.setAttribute("src",
        "http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js");
        if (script_tag.readyState) {
          script_tag.onreadystatechange = function () { // For old versions of IE
            if (this.readyState == 'complete' || this.readyState == 'loaded') {
              scriptLoadHandler();
            }
          };
        } else { // Other browsers
          script_tag.onload = scriptLoadHandler;
        }
        // Try to find the head, otherwise default to the documentElement
        var parentHead = (document.getElementsByTagName("head")[0] || document.documentElement)
        parentHead.insertBefore(script_tag, parentHead.firstChild);
    } else {
      // The jQuery version on the window is the one we want to use
      jQuery = window.jQuery;
      main();
    }

    /******** Called once jQuery has loaded ******/
    function scriptLoadHandler() {
      // Restore $ and window.jQuery to their previous values and store the
      // new jQuery in our local jQuery variable
      jQuery = window.jQuery.noConflict(true);
      // Load Typeahead
      // Call our main function
      main();
    }

    /******** Our main function ********/
    function main() {
      jQuery(document).ready(function($) {

     /******* This is the call to load typeahead *******/
        var url = "https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"
        $.getScript(url, function(){
          var companies = new Bloodhound({
            datumTokenizer: Bloodhound.tokenizers.obj.whitespace('name'),
            queryTokenizer: Bloodhound.tokenizers.whitespace,
            limit: 3000,
            prefetch: {
              // url points to a json file that contains an array of country names, see
              // https://github.com/twitter/typeahead.js/blob/gh-pages/data/countries.json
              url: '/accounts.json',
            }
          });
          // kicks off the loading/processing of `local` and `prefetch`
          companies.initialize();

          // passing in `null` for the `options` arguments will result in the default
          // options being used
          $('#the-basics .search .typeahead').typeahead(null, {
            name: 'companies',
            displayKey: 'name',
            // `ttAdapter` wraps the suggestion engine in an adapter that
            // is compatible with the typeahead jQuery plugin
            source: companies.ttAdapter()
          });
        });
      });
    }
  })();