浏览器(浏览器名称)阻止此站点(Facebook)打开弹出窗口

时间:2017-04-12 04:45:25

标签: javascript jquery ruby-on-rails ajax facebook

我试图在收到服务器端的回复后在facebook上发布一些数据。

示例:

    <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title></title>
    <link rel="stylesheet" href="">
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <style type="text/css"> 
        @media print 
        {
            #printbtn {display: none;}
            thead { display: table-header-group; }
            tfoot { display: table-footer-group; }
        }
        @media screen 
        {
            thead { display: block; }
            tfoot { display: block; position: fixed; }
        }
    </style>
    <script type="text/javascript">
        function printDiv(divID) {
                var divElements = document.getElementById(divID).innerHTML;
                var oldPage = document.body.innerHTML;
                document.body.innerHTML = 
                  "<html><head><title></title></head><body>" + 
                  divElements + "</body>";
                window.print();
                document.body.innerHTML = oldPage;
            }
      </script>
</head>
<body>
    <input type="button" value="print" onclick="javascript:printDiv('tabel');">
    <div id="tabel">
    <table width="1200" border=0>
        <caption>table title and/or explanatory text</caption>
        <thead>
            <tr>
                <td>No.</td>
                <td>Headerrr</td>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <td>This is Footer</td>
                <td>this is footer too</td>
            </tr>
        </tfoot>
        <tbody>
        <?
            $x=1;
            for($x=1;$x<=500;$x++)
            {
                ?>
                <tr>
                    <td><?echo $x;?></td>
                    <td><?echo "Data ".$x;?></td>
                </tr>
                <?
            }
        ?>   
        </tbody>
    </table>
    </div>
</body>
</html>

执行此方法后,获取以下消息 - &#34;浏览器(浏览器名称)阻止此网站打开弹出窗口&#34;

如何在不收到此错误的情况下打开Facebook页面?

1 个答案:

答案 0 :(得分:0)

默认设置中的现代浏览器中的弹出窗口阻止程序只允许弹出窗口在用户交互时直接打开(最常见的是点击一次)。

但是在异步AJAX调用的回调函数中,“直接”连接会丢失。浏览器不再看到与先前用户交互的连接,因此认为它是用户没有要求的“自动”弹出窗口 - 因此它被阻止。

您可以尝试在AJAX请求之前打开弹出窗口,使用空页/ about:blank作为URL(假设share_to_facebook直接在用户交互时调用),然后在您的回调中为弹出窗口分配一个新URL。

function share_to_facebook(url){
    var myPopup = window.open('about:blank', '_blank');

    $.ajax({
    // ...
    success: function(result) {
      if(result.success=="success"){
        // url contains the facebook url with some required parameters.
        myPopup.location.href = url;
     }
    }
  });
}