我想在second.js文件中调用在first.js文件中定义的函数。这两个文件都定义在HTML文件中，如下所示:
<script type="text/javascript" src="first.js"></script>
<script type="text/javascript" src="second.js"></script>
我想在second.js中调用first.js中定义的fn1()。从我的搜索答案是，如果first.js是首先定义的，这是可能的，但从我的测试中，我还没有找到任何方法来做到这一点。
这是我的代码:
second.js
document.getElementById("btn").onclick = function() {
fn1();
}
first.js
function fn1() {
alert("external fn clicked");
}
当前回答
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>
其他回答
在创建函数时使用“var”，然后您可以从另一个文件访问该函数。确保两个文件都能很好地连接到您的项目，并且可以相互访问。
file_1.js
var firstLetterUppercase = function(str) {
str = str.toLowerCase().replace(/\b[a-z]/g, function(letter) {
return letter.toUpperCase();
});
return str;
}
从file_2.js文件中访问这个函数/变量
firstLetterUppercase("gobinda");
输出=> Gobinda
我也遇到过同样的问题。我已经在jquery文档中定义了函数。
$(document).ready(function() {
function xyz()
{
//some code
}
});
我在另一个文件中调用了这个函数xyz()。这不起作用:)你必须在文档准备好上面定义函数。
你可以在first.js中把这个函数设置为全局变量 看一下闭包，不要把它放在文档里。准备好了，放到外面
你也可以使用ajax
$.ajax({
url: "url to script",
dataType: "script",
success: success
});
与使用jquery getScript的方法相同
$.getScript( "ajax/test.js" )
.done(function( script, textStatus ) {
console.log( textStatus );
})
.fail(function( jqxhr, settings, exception ) {
$( "div.log" ).text( "Triggered ajaxError handler." );
});
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
});
它应该像这样工作:
1.js
function fn1() {
document.getElementById("result").innerHTML += "fn1 gets called";
}
2.js
function clickedTheButton() {
fn1();
}
index . html
<html>
<head>
</head>
<body>
<button onclick="clickedTheButton()">Click me</button>
<script type="text/javascript" src="1.js"></script>
<script type="text/javascript" src="2.js"></script>
</body>
</html>
输出
试试这个CodePen代码片段:link。
