無法從外部文件訪問的JavaScript功能

這可能是一個愚蠢的初學者問題，但它讓我發瘋。簡化，代碼：無法從外部文件訪問的JavaScript功能

我有其中一個聯腳本（位於頭元件），一些JS函數定義的的index.php。

<script type="text/javascript"> 
    $(function(){ 
    // other code 
    var popup = function(message,color){ 
     $(".title").css({"color": "beige" }); 
     $(".popup_alert").css({"background-color": color}); 
     $(".popup_alert").append(message); 


     $(".popup_alert").removeClass("offscreen").delay(800).queue(function(){ 
     $(this).addClass("offscreen").dequeue(); 
     $(this).empty(); 
     $(".title").css({"color": "#444" });  
     }); 
    }; 
    }; 
</script>

在<body>的最底部，我加載外部JS文件，其中一些JQuery的情況：
```
<script src="ajaxToDB.js" type="text/javascript"></script> 
```
jQuery是沒有問題的。它被加載並且這個外部文件中的其他功能正在工作。
在這個鏈接文件中，我無法調用index.php中定義的函數。
```
popup("test",orange); 
```
將產生一個控制檯錯誤「未捕獲的ReferenceError：彈出沒有定義」

這是正常的嗎？我已經將所有的東西包裝在一個 $（function（）{...}）之內的ajaxToDB.js中;我讀到這會迫使頁面首先加載，但無濟於事......

什麼是我忽略的愚蠢的細節？！

來源

2016-10-29 Nils Sens

你能重現這個問題在plnkr http://plnkr.co？ – guest271314

我會盡力...... –

我把它剝離到最低限度，它工作。 http://plnkr.co/edit/CNCAXCzakI85z8NehbRV 但是，我無法在那裏使用PHP。我現在認爲它可能與PHP相關。這整個ajaxified mySQL訪問不能真正被複制...：/ –

感謝@guest271314，我學會了在JS結構的教訓：

以前，我曾包裹的主要文件的腳本標籤內的整個代碼$(function(){};此我想裏面，是「必要」的腳本標籤被放置在頭部元素內，否則文件將不會準備好。

但是，當使用另一個外部JS文件時，該技術現在阻止了外部代碼引用內聯聲明的函數，因爲這些現在「等待」文檔的其餘部分準備就緒，包括外部文件涉及尚未申報的/「未決」主要功能）。

哇。

刪除$(function(){};換行並將腳本元素移到主體底部可解決問題。我想這就是它應該放在第一位的地方...... level up

來源

2016-10-29 18:50:38

變量範圍也是一個問題。你在函數定義裏聲明瞭'popup'，然後試圖從函數外部調用它。 –

這是有效的，因爲嵌入在HTML中的腳本將始終加載在另一個從HTML引用的文件中的腳本之前。但是如果您的應用程序變得更大，您可能需要使用諸如RequireJS之類來處理模塊之間的依賴關係。 –

雖然建議是正確的，但我建議你將'popup'函數移動到JS文件中，然後在那裏編寫'document.ready'函數。另外，最好在外部定義函數，然後在'document.ready'中調用它們 – Rajesh

無法從外部文件訪問的JavaScript功能

回答

相關問題