javascript - 无法弄清楚为什么我的弹出窗口被阻止

Question

我准备了这个 jsFiddle：http: //jsfiddle.net/x9D4c/9/

基本上，一个带有fadeOut 回调的按钮会导致我的弹出窗口被阻止，而另一个没有fadeOut 回调的按钮则不会。我应该/可以做些什么不同的事情？

谢谢您的帮助！

在 jsfiddle 中可用的代码下方。

HTML：

<a href="#" id="anchor1">CauseBlock</a> - <a href="#" id="anchor2">Not Cause Block</a>

<div id="greenDiv" style="background-color: green;">green div</div>

JS：

// ################################################

function causeBlock() {
    causeBlockInsideFunction(function () {
        window.open("http://www.google.com/");
    });
}

function causeBlockInsideFunction(callback) {
    $("#greenDiv").fadeOut(function () {
        callback();
    });
}

// ################################################

function notCauseBlock() {
    notCauseBlockInsideFunction(function () {
        window.open("http://www.google.com/");
    });    
}

function notCauseBlockInsideFunction(callback) {
    // [...]
    callback();
}

// ################################################

$(document).ready(function() {
    $("#anchor1").click(function(e) {
        causeBlock();
    });
    $("#anchor2").click(function(e) {
        notCauseBlock();
    });
});

Answer 1

浏览器阻止 JS 代码自动打开弹出窗口。这可以防止页面自动打开数百个窗口。因此，弹出窗口的打开受到某些用户交互（单击）直接触发的函数调用的限制。如果您使用动画，则回调是从属于“自动”类别的某种计时器调用的。