Frage Eine JavaScript-Funktion in einer anderen js-Datei aufrufen


Ich wollte eine Funktion aufrufen, die in einer Datei first.js in der Datei second.js definiert ist. Beide Dateien sind in einer HTML-Datei wie folgt definiert:

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

Ich möchte anrufen fn1() definiert in first.js im second.js. Von meinen Suchen wurden Antworten wenn first.js ist zuerst definiert, aber es ist möglich, aber von meinen Tests habe ich keine Möglichkeit gefunden, das zu tun. Vielen Dank

Bearbeiten:
Hier sind Beispielcodes:
second.js

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

first.js

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

75
2017-09-21 19:19


Ursprung


Antworten:


Eine Funktion kann nur aufgerufen werden, wenn sie in der gleichen Datei definiert wurde oder vor dem Aufruf geladen wurde.

Eine Funktion kann nicht aufgerufen werden, es sei denn, sie befindet sich im selben oder größeren Bereich als derjenige, der versucht, sie aufzurufen.

Sie deklarieren die Funktion fn1 in first.js, und dann können Sie einfach 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>

Es funktioniert gut :)


101
2017-09-21 19:26



Sie können die Funktion in eine globale Variable machen first.js und schau dir das an Schließung  und leg es nicht rein document.ready leg es nach draußen

Sie können auch Ajax verwenden

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

So können Sie auch verwenden 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



1. JS:

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

2. JS:

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

Hoffe das hilft... Glückliche Kodierung.


15
2018-01-19 06:57



first.js

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

Zweite.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



Verwenden Sie den Cache, wenn Ihr Server die Geschwindigkeit erhöhen kann.

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
}

Und dann benutze es so:

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

Optional, machen Sie einen Prototyp, um es flexibler zu machen. So müssen Sie die Datei nicht jedes Mal definieren, wenn Sie eine Funktion aufrufen oder Code aus mehreren Dateien holen wollen.


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 verwendet derzeit ein modul.exports / require-System. Sie können babel verwenden, wenn Sie die Importsyntax verwenden möchten.

// 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