Javascript Onclick window.open Popup无法在Firefox和Safari中运行

时间:2013-07-16 01:04:50

标签: javascript cross-browser

On my website(密码为“WS”,不带引号)我创建了一个带插件的网格(UberGrid)。

为了使每个单元格成为弹出窗口,我在此Wordpress页面中添加了以下代码:

<script type="text/javascript">
function popWin(url)
{
    var thePopCode = window.open(url,'','height=800, width=1000, top=500, left=200, scrollable=yes, menubar=yes, resizable=yes');
    if (window.focus) 
    {
        thePopCode.focus();
    }
}
</script>

在插件内部(在Debra Porter单元内),我添加了以下链接:

javascript: onclick=popWin('http://www.weybridgestrategies.com/team/debra-porter-president-ceo'); return (false);

它可以在Google Chrome中正常使用,但在Firefox或Safari中无效。

2 个答案:

答案 0 :(得分:1)

查看HTML的制作过程:

<a class="uber-grid-hover" href="onclick=popWin(&#039;http://www.weybridgestrategies.com/team/debra-porter-president-ceo&#039;); return (false);"  >

它应该如何:

<a class="uber-grid-hover" href="http://www.weybridgestrategies.com/team/debra-porter-president-ceo"
   onclick="popWin('http://www.weybridgestrategies.com/team/debra-porter-president-ceo'); return false;">

所以你的popWin函数已经可以了,但你需要证明锚点的属性hrefonclickonclick是javaScript,因此您不需要javaScript前缀,也不需要内联onclick=,因为这会创建一个全局变量。如果javascript可用,return false将阻止浏览器关注href。通过使用this.href,这至少在IE中不会达到预期效果,因为这是IE中的事件,而不是锚。

编辑:实际上,你的TestLink可以完成你想要的,就像Firefox Aurora v24一样,没有阻止弹出窗口。

但是我必须遵循Brian的评论,你的新窗口可能被认为是一个弹出窗口,所以如果你window.open(url, '_blank')或只是使用<a target="_blank" href="..."> - 并寻找一个javaScript,那将是最好的弹出窗口“不加载新页面,但看起来更HTML5ish,例如使用jQuery UI或尝试自己的jS(这将是更大问题的另一个答案......;)

更新:释放你已经包含的jQuery的好主意,让我们说javaScript:

<script type="text/javascript">
function popWin(url)
{
  var thePopCode = window.open(url,'','height=800, width=1000, top=500, left=200,scrollable=yes, menubar=yes, resizable=yes');
  if (window.focus) {
    thePopCode.focus();
  }
}

jQuery(document).ready(function ($) {
    // here is your HTML DOM ready

    // create an onclick event for every a.uber-grid-hover
    $("a.uber-grid-hover").click(function (event) {

        event.preventDefault(); // this is "like" return false

        // this get's the href from your anchor, using jQuery sugar
        var url = $(this).attr("href");

        // call your fun
        popWin(url);

    });

});

</script>

使用此脚本,您不再需要为每个锚点创建onclick属性。只需将其放入您的wordpress源代码中,此应该按原样运行。

现在只需使用<a>制作class="uber-grid-hover",这是必需的,以便jQuery可以轻松选择悬停,然后您需要href并且您还可以包含target="_blank"这样非JavaScript用户也可以在新窗口中显示该页面。

<a class="uber-grid-hover" target="_blank"
   href="http://www.weybridgestrategies.com/team/debra-porter-president-ceo">

答案 1 :(得分:0)

试试这段代码:

function popwin(url) {
window.open('', url, 'height=800, width=1000, top=500, left=200, scrollable=yes, menubar=yes, resizable=yes');
url.target =url;
}

对于链接,请使用相同的代码

javascript: onclick=popWin('http://www.weybridgestrategies.com/team/debra-porter-president-ceo'); return (false);