这个简单的Safari扩展代码有什么问题？

Question

这个简单的Safari扩展代码有什么问题？

3

我正在创建一个Safari扩展程序，它将留在Safari的菜单栏中，当点击它时，它将打开所有包含特定字符串的链接。然而，它没有起作用。

这是我的扩展程序构建器屏幕的样子：http://i.imgur.com/xRXB1.png 我没有设置任何外部脚本，因为我只想在点击时运行它，所以我把脚本放在了HTML文件中。

我有一个global.html页面，其中包含以下代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <script type="text/javascript" src="jquery.js"></script>
    </head>
    <body>
        <script>
            safari.application.addEventListener("comnand", performCommand, false);

            Function performCommand(event) {  
                if (event.command == "open-designs") {  
                    $(document).ready(function() {
                        $('a[href*="/Create/DesignProduct.aspx?"]').each(function() {
                            window.open($(this).attr('href'),'_blank');
                        });
                    });
                }  
            }
        </script>
    </body>
</html>

这个不应该有效吗？我可以混合使用jQuery和JS编写，因为jQuery是JS吗？这不是我如何定位链接的方式吗？

- Doug Smith

看起来这个代码正在尝试为每一个引用DesignProduct.aspx的<a>标签打开一个新标签页……它到底应该做什么？ - Lix

这正是它想要做的事情。我希望它能找到页面上包含特定字符串的每个href，并在新标签页中打开它们所有。 - Doug Smith

1

我认为“comnand”不是您可以订阅的有效事件。请检查拼写错误。此外，JS区分大小写。“Function”应该是小写字母“f”的“function”。 - Cᴏʀʏ

2个回答

3

一件很明显的事情是，您的$(document).ready()函数位于另一个函数内部。这基本上消除了对$(document).ready()的需要，只要在完全加载DOM和jQuery后调用该函数一次即可。

重新排列您的代码，仅在DOM和jQuery加载后添加事件侦听器。那就是您使用$(document).ready()回调的目的。

此外，我还看到.each()回调函数存在另一个问题。该函数需要处理两个参数：索引和元素。调用each()会迭代一组元素。对于进入回调函数的每个元素，其索引作为参数传递，以及位于该索引处的元素本身。查看文档获取更多信息。

$(document).ready(function() {
 safari.application.addEventListener("command", performCommand, false);
 console.log("Document is ready to go!");
});

function performCommand(event) {  
  console.log("event recieved");
  if (event.command == "open-designs") {     
    console.log("got 'open-designs' event");
    $('a[href*="/Create/DesignProduct.aspx?"]').each(function(index,elem) {
      console.log("opening window", index, elem);
      window.open($(elem).attr('href'),'_blank');
    });
  }  
}

你可以使用$(document).ready()回调函数来指示DOM已准备好并且jQuery已被初始化。一旦你确定一切准备就绪，你可以设置事件监听器。在监听器添加之前不能调用performCommand()函数（除非有其他引用）。

- Lix

每个元素代表什么意思？它们分别表示什么索引？这让我感到困惑。 - Doug Smith

1

@DougSmith：你已经纠正了“command”上的拼写错误了吗？你的代码可能没有执行任何操作，因为你还没有订阅任何有效的事件。 - Cᴏʀʏ

让我们在聊天中继续这个讨论：http://chat.stackoverflow.com/rooms/11167/discussion-between-lix-and-doug-smith - Lix

@Lix 我卡在同一件事上，你们能告诉我问题出在哪里吗？对于我来说也不能正常工作。 - prashantitis

@Lix 这会对我很有帮助。对我来说，console.log("opening window", index, elem); 日志信息没有打印出来。 - prashantitis

显示剩余9条评论

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Alex Taylor · Accepted Answer

问题在于您的扩展全局页面无法直接访问当前加载的页面的DOM。为了实现您所需的功能，您需要使用注入脚本并使用消息代理与页面通信。

例如，您的全局页面应如下所示：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    <head>
        <script type="text/javascript" src="jquery.js"></script>
    </head>
    <body>
        <script>
            $(document).ready(function() {
                safari.application.addEventListener("command", performCommand, false);
            });

            function performCommand(event) {  
                if (event.command == "open-designs") { 
                    safari.application.activeBrowserWindow.activeTab.page.dispatchMessage("open-designs", "all");
                }  
            }
        </script>
    </body>
</html>

在扩展程序构建器中，您需要添加两个“启动脚本”，一个是jQuery，另一个是新文件，该文件将加载到页面中并类似于以下内容：

function extensionname_openAll(event)
{
    if (event.name == 'open-designs')
    {
        $('a[href*="/Create/DesignProduct.aspx?"]').each(function(index,elem) {
            window.open($(elem).attr('href'),'_blank');
        });
    }
}
safari.self.addEventListener("message", extensionname_openAll, true);