从另一个js文件中的变量调用函数

时间:2015-07-08 14:33:22

标签: javascript

我有这个代码

//first.js 
var site = {};

//and functions are declared like that
site.functionNames = function(){
    //some codes
};

//second.js
$("#element").click(function(){
    //more codes
   site.function;
   site.function();
   console.log(site);
});

如何从second.js点击事件中访问/调用first.js函数? 尝试了上面的那些但是所有人都说 site 是未定义的。不知道是否是正确的方式。

:编辑:

文件已经按顺序声明,second.js是在其他人之后发布的。

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

4 个答案:

答案 0 :(得分:2)

只要您按顺序声明javascript文件,就可以使用它。

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

如果你颠倒了订单,就不会工作

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

答案 1 :(得分:0)

除非在尝试调用它之前在同一文件中定义或加载了一个函数,否则无法调用该函数。

除非函数与试图调用它的范围相同或更大,否则无法调用该函数。

你在first.js中声明函数fn1,然后在第二个你可以只有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>

来源:Calling a javascript function in another js file

答案 2 :(得分:0)

浏览器按照撰写的顺序阅读script个代码,除非asynctrue。所以只需按照你想要的方式放置你的脚本标签,浏览器将在第一个之后执行第二个。


编辑:
也许加载js文件时出错。检查浏览器开发工具。

答案 3 :(得分:0)

这是一个有效的例子

<强>的test.html

<!DOCTYPE html>
<html class="html" lang="es-ES">
<head>
    <script src="scripts/jquery-1.8.3.min.js" type="text/javascript"></script> 
    <script src="tfirst.js" type="text/javascript"></script>
    <script src="tsecond.js" type="text/javascript"></script> 
</head>
    <body>
        <div class="fieldwrapper" name="field1" id="field1" />
            First name: <input type="button" name="first" onclick="site.functionNames('html')"><br>
            Last name: <input type="button" name="second" id="other"><br>       
        </div>  
    <body>
</html>

<强> tfirst.js

var site = {};

//and functions are declared like that
site.functionNames = function(v){
    alert("hello " + v);
};

<强> tsecond.js

$(document).ready(function(){
    $("#field1").on('click', '#other', function () {            
        site.functionNames('second.js');   
        console.log(site);
    });
});