從另一個包含的JavaScript調用包含的JavaScript代碼的函數

Question

我正在嘗試在頁面中使用其他已加載的JavaScript ，但無法讓他們交談。

<html>
<script type="text/javascript" src="jquery144.js"></script>
<script type="text/javascript" src="shared_functions.js"></script>
<script type="text/javascript" src="page_function_callers.js"></script>
</html>


// shared_functions.js
$(document).ready (function () {
    function sayHello (what) {
        alert (what);
    }
});

// page_function_callers.js
$(document).ready (function () {
    $("div.my_button").click (function () {
        sayHello ("Hello world!");
    });
});

我使用jQuery，我想使用這種方式，因為它應該讓我可以回收許多公共方法。 我哪里錯了？

Answer 1

函數sayHello在DOMReady事件（ $(document).ready ）的腳本內部聲明。 在該范圍之外將不可用。 但是沒有必要在該范圍內聲明一個函數。 即使sayHello使用了大量的DOM對象（在您的示例中是不使用），它也不會被執行直到被調用，因此您唯一需要確保的是直到DOMReady之后才調用該函數。。

因此，您可以簡單地刪除shared_functions.js中的第一行和最后一行，即$(document).ready(function() {和}); $(document).ready(function() { 分別，並且您的代碼將起作用。

Answer 2

嘗試在調用$(document).ready之外定義函數sayHello 。

Answer 3

當您在“就緒”功能中聲明“ sayHello”（有人還記得夏洛特·丘奇的歌嗎？天哪，回憶...），它就在該功能的本地。 如果願意，可以將其設置為全局：

window['sayHello'] = function sayHello(what) {
  alert(what);
};

（最好給該函數一個“本地”名稱，即“ function”關鍵字之后的名稱，因為這樣在Firebug中該函數就不會顯示為“ anonymous”。）

我鼓勵您研究將全局函數放入jQuery插件，或者至少將jQuery“ global”放入jQuery對象而不是“ window”的情況。

Answer 4

在上面的代碼中，sayHello（）方法僅在匿名函數的作用域內定義。

此代碼可能更適合您：

// shared_functions.js
window.MyNamespace = window.MyNamespace || {};
MyNamespace.sayHello = function(what)
{
  alert(what);    
};

// page_function_callers.js
$(document).ready (function ()
{
    $("div.my_button").click (function ()
    {
      MyNamespace.sayHello('hello world');    
    });
});

確保以正確的順序加載JS文件。 那里有更多優雅的解決方案，但這是一個相當簡單明了的解決方案。

這種方法的一個優點是不會污染全局名稱空間。

從另一個包含的JavaScript調用包含的JavaScript代碼的函數

問題描述

4 個解決方案

解決方案1
3 2010-02-13 16:31:18

解決方案2
2 2010-02-13 16:29:36

解決方案3
2 已采納 2010-02-13 16:32:24

解決方案4
0 2010-02-13 16:30:48

從另一個包含的JavaScript調用包含的JavaScript代碼的函數

問題描述

4 個解決方案

解決方案1 3 2010-02-13 16:31:18

解決方案2 2 2010-02-13 16:29:36

解決方案3 2 已采納 2010-02-13 16:32:24

解決方案4 0 2010-02-13 16:30:48

解決方案1
3 2010-02-13 16:31:18

解決方案2
2 2010-02-13 16:29:36

解決方案3
2 已采納 2010-02-13 16:32:24

解決方案4
0 2010-02-13 16:30:48