A new page is blocked by the browser when the AJAX request is opened

window.open () I think a lot of people are not familiar with it, it can be implemented in addition to a tag to open a new window!

Recently development projects used to, but encountered trouble, originally good pop-up window, the results were the browser ruthless to intercept!

The code is as follows:

$.getjson (Url,data,function(data,state) {    if(state== ' success ') {         window.open (' http://www.cnblogs.com/garfieldzhong/');    } Else {         alert (' request failed! ');    }})

View Code

This to manually allow the pop-up window, the development of something to give users to play, such a interception is obviously not playing!

This let me baffled its solution, so, only to Baidu Google, found, originally, this incredibly is the browser out of the security considerations, this non-user action to intercept the behavior! This is obviously detrimental to the user experience if not solved!

Method is also quite a lot of, but, some methods try to look like it is not feasible! For example, create a tag, Getjson to trigger a click, it turns out this method is invalid, and add timer, this seems to be not, and, plus timer this thing personally feel also quite not reliable, after all, you can not predict the net speed of Internet users and so on, uncertainty too in!

Here is an introduction to the person personally tried, and effective method!

Method One:

$ ("#btn"). On ("click",function() {    var goto = window.open ();    $.getjson (url,data,function(data,state) {        if(state== ' success ') {             = ' http://www.cnblogs.com/garfieldzhong/'        }else{             alert (' request failed! (');})    });

View Code

This method, you can implement a new window to open a new page, however, it has a problem, that is, when the asynchronous request failed, there will still be a new window open, because it is very obvious, is to start opening an empty new window, and then change the URL of the new window to achieve the jump. This seems to be less in line with our requirements. So find the second way!

Method Two:

$ ("#btn"). On ("click",function() {    false///// request set to synchronous request    $. Getjson (Url,data,function(data,state) {        true;   Remember to set back the asynchronous        if(state== ' success ') {             = '/http = ') after the request is complete www.cnblogs.com/garfieldzhong/'        }else{             alert (' request failed! (');})    });

View Code

The key word is $.ajaxsettings.async, set up the method of the AJAX request, the request is a synchronous request, so it can avoid being blocked by the browser, however, the use of synchronous method is not recommended, so when the Ajax/getjson is finished, you should change the value back to true.

At present, because I level unlimited, can only be achieved with such a method, do not know which God has a better way, hope to give guidance Ah!

A new page is blocked by the browser when the AJAX request is opened