javascript对象无法看到对方？ :: google chrome扩展程序

Question

i have two files 我有两个文件

one called stats.js 一个叫stats.js

one called storage.html 一个叫storage.html

in stats.js in contains 在stats.js中包含

var stats = {
  myFunc : function() {
    //do something
  }
}

in storage.html I have 在storage.html我有

<html>
<head>
<script src="stats.js"></script>
<script>
$(document).ready(function() {
   stats.myFunc(); 
});
</script>
</head>
</html>

But I get 但我明白了

Uncaught TypeError: Cannot call method 'myFunc' of undefined 未捕获的TypeError：无法调用未定义的方法'myFunc'

Update 更新
Ok so that was a really simplified example. 好的，这是一个非常简化的例子。

The basics of it are, 它的基础是，

This is a google chrome extension, So you will see some code specific to that. 这是一个谷歌浏览器扩展，所以你会看到一些特定的代码。

Here is the literal pages concerned: 这是有关的文字页面：

Popup.html Popup.html

 <html> <head> <title>Extension</title> <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script> <script src="js/popup.js"></script> <script src="js/statsapi.js"></script> <link type="text/css" rel="stylesheet" href="css/popup.css" /> </head> <body> <div id="content"> </div> </body> </html>

popup.js popup.js

 $(document).ready(function() { if(background.storage.get('firstRun') == null) background.initialize(); if(background.storage.get('metaExpire') >= Date.parse(Date())) background.updateMeta(); $('#content').append(read_object(stats.getMetaData())); }); function read_object(object){ var $obj = $('<div />'); for(var o in object) { $obj.append(o+' : '); if(typeof(object[o]) == 'object' && object[o] != null) $obj.append(read_object(object[o])); else $obj.append(object[o]+'<br />'); } return $obj; }

Manifest.json 的manifest.json

 { "name": "Halo Reach: Stats", "description": "This extension allows you to keep track of your own, and your friends Halo Reach Stats.", "version": "1.0.0.1", "permissions": [ "http://www.bungie.net/" ], "icons": { "128": "images/logo/logo128.jpg", "64": "images/logo/logo64.jpg", "32": "images/logo/logo32.jpg", "16": "images/logo/logo16.jpg" }, "browser_action": { "default_title": "Open Stats", "default_icon": "images/logo/logo32.jpg", "popup": "popup.html" }, "background_page": "background.html" }

statsapi.js statsapi.js

 var background = chrome.extension.getBackgroundPage(); var apikey = background.storage.get('apikey'); var gamertage = background.storage.get('gamertag'); var page = '0'; var stats = { getMetaData : function() { var url = 'http://www.bungie.net/api/reach/reachapijson.svc/game/metadata/'+apikey; console.log(url); $.ajax({ url: url, success: function(data) { return data; } }); }, meta : { read : function(param) { var meta = background.storage.get('metaData'); } } };

Background.html Background.html

 <html> <head> <script src="js/statsapi.js"></script> <script> var storage = { set : function (key, value) { window.localStorage.removeItem(key); window.localStorage.setItem(key, value); }, get : function (key) { return window.localStorage.getItem(key); }, clear : function () { window.localStorage.clear(); } }; function updateMeta() { var meta = stats.getMetaData(); if(meta['status'] == 0){ storage.set('metaData', JSON.stringify(meta)); storage.set('metaExpire', Date.parse(Date())+900000); } } function initialize() { storage.set('apikey', '***'); storage.set('gamertag', 'The Hailwood'); updateMeta(); } </script> </head> </html>

When the extension is invoked it calls popup.html 调用扩展时，它会调用popup.html

and the document ready javascript is invoked. 并调用文档就绪的javascript。

The check for first run fails, 首次检查失败，

so it calls initialize() in background.html 所以它在background.html中调用initialize()

But this is where the error occurs. 但这是错误发生的地方。

the actual error is 实际的错误是

Uncaught TypeError: Cannot call method 'getMetaData' of undefined. 未捕获的TypeError：无法调用未定义的方法'getMetaData'。

So why can it not see the stats class? 那为什么不能看到统计类呢？

its not a script include problem as if the path is wrong for the statsapi.js I get 它不是一个脚本包含问题，好像我得到的statsapi.js的路径是错误的

Uncaught ReferenceError: stats is not defined. 未捕获的ReferenceError：未定义统计信息。

The issue seems to be with the var stats {} as if under that I have a function called test() I can call that fine :/ 问题似乎是var stats {}好像在我之下我有一个名为test（）的函数我可以称之为罚款：/

Hmm, 嗯，

is there an issue because it is an external stylesheet? 是否存在问题，因为它是外部样式表？

Answer 1

I suspect the error lies somewhere else - these are my examples: 我怀疑错误在别的地方 - 这些是我的例子：

mark@localhost:~/ccsite$ cat cat.js 
var stats = {
  myFunc : function() {
    alert('wtf');
  }
}


mark@localhost:~/ccsite$ cat hat.htm 
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script src="cat.js"></script>
<script>
$(document).ready(function() {
   stats.myFunc(); 
});
</script>
</head>
</html>

Viewing hat.htm in either FF, IE6 or Chrome produces the alert, 'wtf'. 在FF，IE6或Chrome中查看hat.htm会生成警报“wtf”。 As written you'd get $ is undefined, since it's not including jQuery of course, so I added that. 正如所写，你得到$是未定义的，因为它当然不包括jQuery，所以我补充说。

So, your problems likely are elsewhere. 所以，你的问题可能在其他地方。 I assume this is a simplified example - what else is going on in your page? 我假设这是一个简化的例子 - 你的页面还有什么？

Answer 2

This is because there is some syntax error in your code. 这是因为您的代码中存在一些语法错误。 I had same problem. 我有同样的问题。 I opened my background.html page in fire fox with fire-bug plug-in enabled. 我在火狐中打开了我的background.html页面并启用了火焰插件。 Fire-bug console should me the error, I fixed and it is working now. Fire-bug控制台应该是我的错误，我修复了它现在正在工作。

Answer 3

我怀疑这是因为你在你的弹出窗口和后台页面都包含了js/statsapi.js脚本，所以当你在弹出窗口中有2个时，它会混淆你所指的属性 - 一个通过script标签包含，另一个包含调用chrome.extension.getBackgroundPage()后从后台页面加载

javascript对象无法看到对方？ :: google chrome扩展程序

问题描述

3 个解决方案

解决方案1
1 已采纳 2010-09-29 10:01:32

解决方案2
1 2010-12-19 22:08:24

解决方案3
0 2010-09-29 15:04:45

javascript对象无法看到对方？ :: google chrome扩展程序

问题描述

3 个解决方案

解决方案1 1 已采纳 2010-09-29 10:01:32

解决方案2 1 2010-12-19 22:08:24

解决方案3 0 2010-09-29 15:04:45

解决方案1
1 已采纳 2010-09-29 10:01:32

解决方案2
1 2010-12-19 22:08:24

解决方案3
0 2010-09-29 15:04:45