Solution to opening a new window with window. open in Ajax Request Response

Source: Internet
Author: User
After the ajax asynchronous request is successful, you need to open a new window to open the url, using window. open () method, but it will be intercepted by the browser. How can this problem be solved? The following section will explain the problem to you.

After the ajax asynchronous request is successful, you need to open the url in a new window. The window. open () method is used, but it will be blocked by the browser. You need to click it.

Ii. Problem Analysis

The reason why the browser intercepts new windows is that this operation is not triggered by the user, so it considers it unsafe to intercept the window, even if the ajax callback function simulates the execution of user behaviors such as click or submit (trigger ('click'), the browser will think that it is not triggered by the user, so it cannot be safely executed, so it is intercepted.

Note:

1. If window. open () is called in the fun method specified in this example, it will not be blocked because the browser will think it is active. However, opening a window in the response to an ajax request is blocked.

2. If you do not open a new window, but change the original webpage address, you can use window. location = newurl to implement it. This will not be blocked.

Iii. Solutions

Before ajax requests, use window. open to open a blank window, and then set the location attribute of the window to a new url in the ajax response function.

Sample Code:

Function fun () {var tmpWin = window. open () ajax (xxx, handle () {// callback function. This is a pseudo-code with inaccurate syntax. Var newurl = xxxxtmpWin. location = newurl ;})}

The above method has a problem because a blank window is opened first. If the ajax request fails (network or business logic problems), no normal results will be displayed in the new window, this may cause user confusion.
One solution is to give a prompt when ajax encounters a problem, such as tmpWin.doc ument. write ("server Exception Handling ");

Even to prevent the ajax response time from being too long, the prompt tmpWin.doc ument. write ("the server is processing, please wait") is displayed immediately after the window is created ");

If ajax returns normally, the original printed information will be overwritten by the new page information because the location value is set.

There is also a method, but there are also defects:

Because ajax can be set as a synchronous request, you can use window. open to open a new window after the ajax request. For example:

Function fun () {var result; ajax ({// synchronous request needs to be set ..... result = xxx .......}) if (result) {window. open (xxxx )}}

The above practice is to open a new window only after judging the ajax request results, avoiding the problems mentioned above.
However, because it is a synchronous request, we found a problem during the test. If the server response time is too long, first, the interface will pause (the user experience is poor), and second, the new window will be blocked.

No problem is found only when the server returns quickly. During the test, we sleep for 1 second in the server code processing and found that the new window was intercepted.

Iv. Summary

To sum up, we can see that there is no perfect way to open a new window after ajax returns. Take appropriate measures based on the business characteristics of your system.

The above section describes how to use window in Ajax request response. open a new window to intercept the solution, hope to help you, if you have any questions, please leave a message, xiaobian will reply to you in a timely manner. I would like to thank you for your support for PHP chinnet!

For more information about how to use window. open to open a new window in the response to Ajax requests, see PHP!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.