Javascript錯誤;而在本地嘗試

下面的代碼給出「Uncaught TypeError：不能調用未定義的方法'getContext'」。該代碼是我的實驗，使用here所述的模塊模式來移植畫布應用。Javascript錯誤;而在本地嘗試

請在jsfiddle找到相同的代碼，它工作正常。

謝謝。

//====test.html ========

<html> 
<head> 
    <title>Location</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script type="text/javascript" src="test.js"></script> 
</head> 

<body> 
<canvas id="cvs" height="600" width="800"></canvas> 
</body> 
</html>

//==test.js ========

if (typeof (NS) === 'undefined') { 
    NS = {}; 
} 

NS.AppName = (function ($) { 
// Private members 
    /*var _first = function() { 
    }, 
    _second = function() { 
    },*/ 
    var _cvs = $("#cvs"); 
    var _ctx = _cvs.get(0).getContext("2d");  

    var _privateVar = "privateVar: accessed from within AppLaunch.Admin namespace"; 
    // Private Methods 
    var _privateMethod = function() { 
     log("privateMethod: accessed only from within AppLaunch.Admin"); 
    }; // Last variable in a chain must always end with ; before the return {} 

    function log() { 
     if (window.console && window.console.log) 
      window.console.log('[AppName] ' + Array.prototype.join.call(arguments, ' ')); 
    }; 

    return { 
     init: function() { 
     }, 

     // Public 
     myPublicMethod: function() { 
      //alert("myPublicMethod" + _cvs.height()); 
      _ctx.fillRect(25,25,100,100); 
    _ctx.clearRect(45,45,60,60); 
    _ctx.strokeRect(50,50,50,50); 
     } 
    } 
})(jQuery); 

// Initialize 
jQuery().ready(function() { 
    NS.AppName.init() 
    NS.AppName.myPublicMethod(); 
});

來源

2011-05-01 bsr

原因你會得到一個錯誤，self executing anonymous function用於初始化NS.AppName在適當的位置（在它被定義的地方）被調用，而不是在DOM準備就緒時被調用。

NS.AppName = (function ($) { 
    //1: some code 
    return function(){...}//2 
}(jQuery));//3 

$(function(){ 
    NS.AppName();//4 
});

線3是自執行一部分。它調用上面聲明的匿名函數。

在匿名函數體將被執行的3線的呼叫（在函數內部包括線1，但不是在任何線）。如果在發生這種情況時未加載文檔（例如：如果腳本在頭部），則會失敗，因爲DOM中沒有$("#cvs")。

線4將調用在線2當DOM滿載中定義的功能（$(f)相當於$(document).ready(f)）。

下面是關於自我執行的匿名功能，或者使用一個更好的名字「Immediately-Invoked Function Expression」

您可以修復腳本的方法有三種一些更多的信息：

刪除任何引用從該DOM匿名函數，並將其移動到返回一個（我會做到這一點，它只是一個元素...）
包住整個腳本jQuery(function($){...(you can safely use $ here, so no need for the anonymous functions)...}); - 底部執行它所有的DOM準備
舉動吧的頁面（不理想，但它會工作）

來源

2011-05-01 13:46:32

感謝您的詳細說明... – bsr 2011-05-01 15:13:14

你ready處理語法不正確 - 試試這個：

jQuery(document).ready(function() { 
    NS.AppName.init(); 
    NS.AppName.myPublicMethod(); 
});

或者

jQuery(function() { 
    NS.AppName.init(); 
    NS.AppName.myPublicMethod(); 
});

來源

2011-05-01 03:49:06

我沒有收到錯誤。但是，也許在你的翻譯中丟失了某些東西。也許（這只是一個猜測），把一個;對NS.AppName.init()結束，也許你有一些時髦的空白/回報對那裏......

來源

2011-05-01 03:51:53

移動JS給體解決了這個問題：

<html> 
<head> 
    <title>Location</title> 
</head> 

<body> 
<canvas id="cvs" height="600" width="800"></canvas> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script type="text/javascript" src="test.js"></script> 
</body> 
</html>

或

<html> 
<head> 
    <title>Location</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
</head> 

<body> 
<canvas id="cvs" height="600" width="800"></canvas>  
    <script type="text/javascript" src="test.js"></script> 
</body> 
</html>

來源

2011-05-01 10:30:03 bsr

Javascript錯誤;而在本地嘗試

回答

相關問題