Pregunta Llamar a una función de JavaScript en otro archivo js


Quería llamar a una función definida en un archivo first.js en el archivo second.js. ambos archivos están definidos en un archivo HTML como:

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

quiero llamar fn1() definido en first.js en second.js. De mis búsquedas las respuestas fueron si first.js Primero se define, pero es posible, pero de mis pruebas no he encontrado ninguna manera de hacerlo. Gracias

Editar:
Aquí hay ejemplos de códigos:
second.js

document.getElementById("btn").onclick = function(){
    fn1();
}

first.js

function fn1(){
 alert("external fn clicked");
}

75
2017-09-21 19:19


origen


Respuestas:


No se puede invocar una función a menos que se haya definido en el mismo archivo o en uno cargado antes de intentar llamarlo.

No se puede invocar una función a menos que esté en el mismo o mayor alcance que el que intenta llamarlo.

Usted declara la función fn1 en first.js, y luego en el segundo solo puede tener fn1 ();

1.js:

function fn1 (){
    alert();
}

2.js:

fn1();

index.html:

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

Funciona bien :)


101
2017-09-21 19:26



Puede hacer que la función sea una variable global en first.js y echa un vistazo a cierre  y no lo pongas document.ready ponlo afuera

puedes usar ajax también

    $.ajax({
      url: "url to script",
      dataType: "script",
      success: success
    });

De la misma manera que puedes usar jquery getScript

$.getScript( "ajax/test.js" )
  .done(function( script, textStatus ) {
    console.log( textStatus );
  })
  .fail(function( jqxhr, settings, exception ) {
    $( "div.log" ).text( "Triggered ajaxError handler." );
});

19
2017-09-21 19:22



1st JS:

function fn(){
   alert("Hello! Uncle Namaste...Chalo Kaaam ki Baat p Aate h...");
}

2da JS:

$.getscript("url or name of 1st Js File",function(){
fn();
});

Espero que esto ayude... Feliz Codificación.


15
2018-01-19 06:57



first.js

function first() { alert("first"); }

Second.js

var imported = document.createElement("script");
imported.src = "other js/first.js";  //saved in "other js" folder
document.getElementsByTagName("head")[0].appendChild(imported);


function second() { alert("Second");}

index.html

 <HTML>
    <HEAD>
       <SCRIPT SRC="second.js"></SCRIPT>
    </HEAD>
    <BODY>
       <a href="javascript:second()">method in second js</a><br/>
       <a href="javascript:first()">method in firstjs ("included" by the first)</a>
    </BODY>
</HTML>

2
2017-10-23 02:31



Use la memoria caché si su servidor le permite mejorar la velocidad.

var extern =(url)=> {           // load extern javascript
    let scr = $.extend({}, {
        dataType: 'script',
        cache: true,
        url: url
    });
    return $.ajax(scr);
}
function ext(file, func) {
    extern(file).done(func);    // calls a function from an extern javascript file
}

Y luego úsalo así:

ext('somefile.js',()=>              
    myFunc(args)
);  

Opcionalmente, haga un prototipo para tenerlo más flexible. Para que no tenga que definir el archivo cada vez, si llama a una función o si desea obtener código de varios archivos.


1
2017-11-02 14:46



window.onload = function(){
    document.getElementById("btn").onclick = function(){
        fn1();
    }
   // this should work, It calls when all js files loaded, No matter what position you have written
});

0
2018-03-14 10:40



Node.js

Node.js está utilizando actualmente un sistema module.exports / require. Puedes usar babel para transpilar si quieres la sintaxis de importación.

// mymodule.js
exports.hello = function() {
  return "TCS";
}

// server.js
const myModule = require('./mymodule');
let val = myModule.hello(); // val is "TCS"   

0
2018-06-30 12:21