小书签如何避免弹出窗口阻止程序

Question

我写了一个小书签，用于在弹出窗口中使用谷歌翻译器快速翻译选定的文本：

javascript:(function(){
    var text = encodeURI(document.getSelection());
    if (!text.length) {
        text = prompt('Texto')
    }
    var url = 'http://translate.google.com/translate_t?hl=&ie=UTF-8&text=' + text + ' &sl=es&tl=pt#';
    window.open(url,'trans','left=20,top=20,width=1000,height=500,toolbar=0,location=0,resizable=1');
})();

但是，Firefox 弹出窗口阻止程序不允许打开新窗口。我可以为我使用弹出窗口的每个站点添加例外，但这可能很烦人......

我认为书签可以打开弹出窗口 - 实际上，很多人都这样做，对吗？我究竟做错了什么？还是做不到？

Answer 1

还有另一种解决弹出窗口阻止程序的方法，首先包括一个覆盖在页面上的链接，然后允许用户单击该链接以生成弹出窗口。然后可以将小书签 javascript 存储在单独的文件中。这就是 Pinterest 的小书签设法做到这一点的方式。首先，他们从页面中选择图像并将其直接覆盖在页面上。然后，当用户单击以选择其中一张照片时，会出现弹出窗口。因为此操作是由用户发起的，所以弹出窗口有效。

这里有一些你可以用来测试的代码：

将它放在一个名为 bookmarklet.js 的文件中

var popupProperties='width=600,height=400,toolbar=0,location=0,resizable=1';
var newA = document.createElement("a");
var url = 'http://www.stackoverflow.com';
newA.setAttribute("href","javascript:window.open(url,'Hi',popupProperties);");
newA.setAttribute("style","position:fixed;z-index:9999999;top:0;left:0;width:100px;height:100px;color:#000;background:#fff;display:block;");
var newT = document.createTextNode("Open this");
newA.appendChild(newT);
document.body.appendChild(newA);

然后你的书签链接可以是这样的：

javascript:var jsCode = document.createElement('script');jsCode.setAttribute('src', 'http://localhost/bookmarklet.js?r='+Math.random()*99999999);document.body.appendChild(jsCode);

或者，您需要在实际的小书签链接中包含弹出窗口。这反过来意味着进行任何更改的唯一方法是让用户重新安装书签。

编辑：除了上述方法，我后来发现还有另一种方法可以解决这个问题，即使用 easyXDM。它可以帮助您解决同源策略http://easyxdm.net/wp/

使用它，您可以将 iframe 用于您的书签，甚至可以在 iframe 中添加一个“关闭”链接，该链接将能够从父页面中删除 iframe。

Answer 2

防止浏览器提示弹出窗口阻止程序的一种方法是将您的 javascript 完全包含在锚标记中。

一旦你引用了另一个文件，它显然会触发浏览器的弹出窗口拦截器。

例如，当用户将锚点拖到浏览器的书签栏时，以下代码不会触发弹出窗口拦截器：

<a href="javascript:window.open('http://tagsby.me/index.small.php','newWindowName','width=960,height=400,scrollbars=yes,status=no,titlebar=no,toolbar=no');void(0);">No blocker</a>

但是，如果您在另一个文件noblocker.js 中引用相同的代码，该文件已附加到用户当前访问的站点的文档对象中：

<a id="tbm" class="testing" href="javascript:(function(){document.body.appendChild(document.createElement('script')).src='http://domain.com/noblocker.js';})();">

它将触发弹出窗口阻止程序。可能还有另一种方法，但这就是我现在在我的网站http://tagsby.me 上所做的工作。

Answer 3

有趣的问题，我的直觉是这是不可能的，因为浏览器不一定会跟踪哪个代码正在尝试打开一个新窗口，所以它不能“允许”它，因为它来自站点 X。

我觉得实际上更好的一个选项是在同一窗口的对话框中打开内容。看看如何实现一个 jquery 小书签，其余的应该是直截了当的：

http://www.latentmotion.com/how-to-create-a-jquery-bookmarklet/

Answer 4

弹出窗口阻止程序具有添加异常的功能。也许尝试为 translate.google.com 添加一个例外

（工具菜单->选项->内容部分）