Tengo 2 funciones de 2 tipos de documentos .js diferentes.
Archivo1.js
$(document).ready(function Function1(){ var $input = $("#input-country"); $input.typeahead({source:['United States', 'China', 'Germany']}); });Archivo2.js
$(document).ready(function Function2(){ var $input = $("#input-country"); $input.typeahead({source:['Menu 1', 'Menu 2', 'Menu 3']}); });Creé un js global, que llamó a las 2 funciones, global.js
Global.js
$(function TestName() { Function1(); Function2(); });Al importar los archivos, solo funciona lo que está en el pedido.
<script src="js/File1.js"></script> <script src="js/File2.js"></script>En este caso, solo funciona File1.js, el segundo no.
o
<script src="js/File2.js"></script> <script src="js/File1.js"></script>En este caso, solo funciona File2.js, el primero no.
En primer lugar, debe intentar evitar contaminar el espacio de nombres global en la medida de lo posible; sin embargo, la funcionalidad compartida en un navegador web se puede lograr mediante la asignación al objeto de ventana de la siguiente manera:
// File 1 - using an immediately invoked function expression (IFFE) (function(global) { // make available globally: global.funcOne = myFunc; var privateVariable = 1; function myFunc() { return privateVariable; } }(window)); // File 2 - using an immediately invoked function expression (IFFE) (function(global) { // make available globally: global.funcTwo = myFunc; var privateVariable = 2; function myFunc() { return privateVariable; } }(window)); // your "global" js file (using the jquery document ready wrapper): $(function() { console.log(funcOne() + funcTwo()); // returns 3 });Aquí hay un JsFiddle que demuestra este concepto.
Nota : el patrón IFFE es menos común, ya que la última versión de ECMAScript junto con un paquete de módulos nos permite hacer esto de manera más elegante.
Para mostrar que esto funciona para su ejemplo específico, esto es lo que haría:
// File 1 (function(global, $) { // make available globally: global.setCountries = setCountries; // private variable: var data = {source:['United States', 'China', 'Germany']}; function setCountries() { $("#input-country").typeahead(data); console.log('setCountries() Called!'); // not required. } // dependencies: }(window, jquery)); // File 2 (function(global, $) { // expose global function: global.setMenu = setMenu; // private variable: var data = {source:['Menu 1', 'Menu 2', 'Menu 3']}; // private function: function setMenu() { $("#input-country").typeahead(data); console.log('SetMenu() Called!'); // not required. } // dependencies: }(window, jquery)); // Global Js $(function() { function TestName() { setMenu(); setCountries(); } TestName(); });