在Input中使用外部Jquery

Question

I want to use the typeahead code(external file, country.js)

var $input = $("#input-search_address");
$input.typeahead({source:['United States', 'United Kingdom', 'Germany','China']});

But this code above, it is a separate file, not in the same jsp, it is in the country.js file. When I use the same code, however in jsp I do this:

  <script>
   var $input = $("#input-country");
    $input.typeahead({source:['United States', 'United Kingdom', 'Germany','China']});
  </script>

What about my input,

<input type="text" id="input-country" class="input" placeholder="Country">

In other words, I use the same code in country.js does not work, and when I put the same code in jsp, just adding works.

I wanted typeahead to work without being in jsp, but in country.js

I use to import .js:

<script src="javascript/country.js" type="text"></script> 

Any tips, help?

enter image description here

Thank you!

Answer 1

In your country.js file, wait for the page to be ready first:

$(function() {
  // now write your code
});

Answer 2

Any other tips? The reference to the other file, country.js, is being successfully made. But the code does not work.