如何从html中调用jquery代码中的外部函数?

时间:2013-02-16 08:44:24

标签: javascript jquery html function

我需要加载函数来从HTML文件中包含的外部JS获取数据,我这样做:

<body onLoad="getTicket();">
......
</body>

或者这个:

<html>
<body>
    <head>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/functions.js" type="text/javascript"></script>
    <script>
        $(document).ready(function() {
            getTicket();
        });
    <script>
    </head>
<body>
</html>

或者这个:

<html>
<body>
    <head>
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/functions.js" type="text/javascript"></script>
    <script>
        getTicket();
    <script>
    </head>
<body>
</html>

我在函数中有这个.JS:

functioOne() {

}

functionTwo() {

}

$(document).ready(function() {
    ...
    .....
    function getTicket() {
        //to do
    }
});

但是没有用,在控制台中显示:

Uncaught ReferenceError: getTicket is not defined 

问候。

5 个答案:

答案 0 :(得分:9)

您的getTicket函数仅在jQuery闭包(匿名函数)的上下文(范围)中定义。而是在全局范围内定义它(文件中的其他位置而不是“函数参数”)。

如果您需要来自该范围的变量,请将它们封装在命名空间(对象)中,或将其声明为window.getTicket = function() { /* ... */}

答案 1 :(得分:4)

你可以这样做:

$(document).ready(function() {
  ...
  .....
  window.getTicket = function() {
    //to do
  } 
});

文档准备好后,您就可以调用getTicket

答案 2 :(得分:4)

尝试将function getTicket(){}放在外面或doc ready

functio One() {

}

function Two() {

}
function getTicket() {
    //to do
}

$(document).ready(function() {
...
.....
   getTicket();
});

您的收录顺序是完美的,没有问题。

<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/functions.js" type="text/javascript"></script>

这很好。

答案 3 :(得分:0)

<script type="text/javascript src="external.js"></script>添加到head

然后你必须等待文档完全加载。

问题是您的代码以这种方式执行:

  • 执行external.js
  • 您的函数未定义,因为文档尚未完成加载
  • 你调用未定义的函数
  • 文件准备就绪

恕我直言我不认为在$(document).ready中定义一个函数是个好主意。通常定义该函数会更简单,然后在$(document).ready中调用它。

答案 4 :(得分:0)

在调用函数之前,必须包含js文件。如果你这样做:

<html>
<body>
    <head>
    <!-- include script files here.(jquery and custom script files) -->
    <script>
        $(document).ready(function() {
            getTicket();
        });
    </script>
    </head>
<body>
</html>

在调用函数之前必须包含脚本文件。