0

我正在尝试创建一个扩展来显示使用 google feed api 从我的 feed 中获取的所有最新帖子。为了实现这一点，我在 background.js 中添加了这段代码：

appAPI.ready(function() {
// Global variable to hold the toggle state of the button
var buttonState = true;

// Sets the initial browser icon
appAPI.browserAction.setResourceIcon('images/icon.png');
// Sets the tooltip for the button
appAPI.browserAction.setTitle('My Postreader Extension');   
appAPI.browserAction.setPopup({
    resourcePath:'html/popup.html',
    height: 300,
    width: 300
});});

在popup.html中，

 <!DOCTYPE html><html><head><meta http-equiv="X-UA-Compatible" content="IE=edge">
<script type="text/javascript">
function crossriderMain($) {eval(appAPI.resources.get('script.js'));   }</script>
</head>
<body><div id="feed"></div></body></html>

script.js文件是-

google.load("feeds", "1");

function initialize() {
  var feed = new google.feeds.Feed("http://www.xxxxx.com/feed/");
  feed.setNumEntries(10);
  feed.load(function(result) {
    if (!result.error) {
      var container = document.getElementById("feed");
      for (var i = 0; i < result.feed.entries.length; i++) {
        var entry = result.feed.entries[i];
        var div = document.createElement("div");
        var link = document.createElement('a');
        link.setAttribute('href', entry.link);
        link.setAttribute('name', 'myanchor');
        div.appendChild(document.createTextNode(entry.title));
        div.appendChild(document.createElement('br'));
        div.appendChild(link);
        div.appendChild(document.createElement('br'));
        container.appendChild(div);
      }
    }
  });
}
google.setOnLoadCallback(initialize);

但我无法得到想要的结果。弹出窗口不显示任何内容。它只是保持空白。

4

1 回答 1

0

由于您使用资源文件来存储弹出窗口的内容，因此最好从crossriderMain函数加载远程脚本，如下所示：

<!DOCTYPE html>
<html>
<head>
<!-- This meta tag is relevant only for IE -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<script type="text/javascript">
function crossriderMain($) {
  appAPI.db.async.get('style-css', function(rules) {
    $('<style type="text/css">').text(rules).appendTo('head');
  });

  appAPI.request.get({
    url: 'http://www.google.com/jsapi',
    onSuccess: function(code) {
      $.globalEval(code);
      appAPI.db.async.get('script-js', function(code) {
        // runs in the context of the extension
        $.globalEval(code.replace('CONTEXT','EXTN'));

        // Alternatively, run in context of page DOM
        $('<script type="text/javascript">').html(code.replace('CONTEXT','PAGE DOM')).appendTo('head');
      });
    }
  });
}
</script>
</head>
<body>
<h1>Hello World</h1>
<div id="feed"></div>
</body>
</html>

[免责声明：我是 Crossrider 的员工]

于 2013-10-23T12:09:09.350 回答