Home Web Front-end JS Tutorial How to deal with interception when opening a new window in Ajax request response

How to deal with interception when opening a new window in Ajax request response

Apr 03, 2018 pm 05:30 PM
ajax Open window

This time I will bring you how to deal with the interception of opening a new window in the Ajax request response. What are the things to note when dealing with the interception of opening a new window in the Ajax request response? The following is a practical case. Get up and take a look.

1. Problem description After ajax asynchronous request is successful, a new window needs to be opened to open the url, and

window.open# is used. ##() method, but it will be intercepted by the browser and requires the user to click.

2. Problem Analysis

The reason why the browser intercepts the newly opened window is because the operation is not actively triggered by the user, so it thinks This is intercepted because it is unsafe. Even if the ajax callback function

simulates user behavior such as click or submit (trigger('click')), the browser will think that it is not actively triggered by the user, so It cannot be executed safely, so it is intercepted.

Instructions:

1. If it is onclick="fun()"> Calling window.open() in the fun method specified in this will not be intercepted because the browser will think it is active. But opening the window in the response of the ajax request will be intercepted. 2. If instead of opening a new window, you change the original web page address, you can use window.location = newurl to achieve this, so that it will not be intercepted.

3. Solution

Before ajax request, use window.open to open a blank window, and then in the ajax response function Set the location attribute of the window to the new URL.

Code example:

1

2

3

4

5

6

7

8

function fun(){

var tmpWin =window.open()

ajax(xxx, handle(){ 

//回调函数。这是伪代码,语法不准。

var newurl = xxxx

tmpWin.location = newurl;

})

}

Copy after login
When there is a problem with the above method, because a blank window is opened first, if the ajax request fails (network or business logic problem), there will be no new window. There will be normal results, which may cause confusion to users.

One solution is that when there is a problem with ajax, you can consider giving a prompt, such as tmpWin.

document

.write("Server processing exception");
Even to prevent The ajax response time is too long. When the window is created, the prompt tmpWin.document.write("The server is processing, please wait") is immediately given;

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

There is another method here, but it also has flaws:

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:

1

2

3

4

5

6

7

8

9

10

11

function fun(){

var result;

ajax({ //需要设置同步请求

.....

result = xxx 

.......

}) 

if(result){

window.open(xxxx)

}

}

Copy after login
The above approach avoids the problems mentioned above because it opens a new window after judging the result of the ajax request.

But because it is a synchronous request, we found a problem in our test. If the server response time is too long, firstly, the interface will pause (the user experience is not good), and secondly, the new window will be intercepted.

There is no problem only if the server returns quickly. During our test, we slept for 1 second during server code processing and found that the new window was blocked.

4. Summary

In summary, it can be seen that there is no particularly perfect method for opening a new window after ajax returns. Specifically, you need to take appropriate measures based on the business characteristics of your own system.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

How to deal with Ajax submission garbled code under IE


Detailed steps for ajax to send data types to the server

The above is the detailed content of How to deal with interception when opening a new window in Ajax request response. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Java Tutorial
1662
14
PHP Tutorial
1261
29
C# Tutorial
1234
24
How to open iso file on mobile phone How to open iso file on mobile phone Feb 24, 2024 pm 05:33 PM

With the development of technology, more and more people are now starting to use ISO files. An ISO file is a format of a disc file that usually contains all the contents of the disc, including operating system, software, games, etc. Opening an ISO file on your computer is relatively simple, just use virtual optical drive software. However, when we want to open ISO files on our mobile phones, it may be more troublesome. Well, this article will introduce some methods for you to easily open ISO files on your phone. 1. Using the virtual optical drive application First, we can install

How to set Google Chrome to open a new window every time How to set Google Chrome to open a new window every time Mar 06, 2024 pm 06:19 PM

How to set Google Chrome to open a new window every time? Vicious users like to use Google Chrome for work or study. This browser is safe, fast, and convenient. Different users have different preferences for using browsers. Some users like to open Google Chrome as a new window to facilitate quick searches. , so how to set it up. Next, the editor will bring you a tutorial on setting up a new window every time you open Google Chrome. Friends who are interested can come and learn it. Tutorial on setting up a new window every time Google Chrome opens 1. Double-click Google Chrome on your computer desktop to open it, then click on the [three dots] icon in the upper right corner. 2. Find the [Settings] option and enter the page (as shown in the picture). 3. Go to Google Chrome

Can I open an XML file using PowerPoint? Can I open an XML file using PowerPoint? Feb 19, 2024 pm 09:06 PM

Can XML files be opened with PPT? XML, Extensible Markup Language (Extensible Markup Language), is a universal markup language that is widely used in data exchange and data storage. Compared with HTML, XML is more flexible and can define its own tags and data structures, making the storage and exchange of data more convenient and unified. PPT, or PowerPoint, is a software developed by Microsoft for creating presentations. It provides a comprehensive way of

Share the method to solve the problem that PyCharm cannot be opened Share the method to solve the problem that PyCharm cannot be opened Feb 22, 2024 am 09:03 AM

Title: How to solve the problem that PyCharm cannot be opened. PyCharm is a powerful Python integrated development environment, but sometimes we may encounter the problem that PyCharm cannot be opened. In this article, we'll share some common workarounds and provide specific code examples. Hope this helps those who encounter this problem. Method 1: Clear the cache Sometimes PyCharm’s cache files may cause the program to fail to open normally. We can try clearing the cache to solve this problem. Tool

How to open caj file How to open caj file on computer How to open caj file How to open caj file on computer Feb 22, 2024 pm 04:37 PM

Select the file in the word converter and click Start Conversion to open it. Analysis 1. Open the CAJ to Word converter and select CAJ to Word on the left side of the software. 2Then select the file you want to convert and click Open. 3Finally, click Start Conversion and you can open the caj file in Word. Supplement: What is the format of caj? 1CAJ is a format of electronic journals. You can use the CAJ full-text browser to read. Supports CAJ, NH, KDH and PDF format files of China Journal Network. You can read the original text of China Journal Network online, or you can read the full text of China Journal Network downloaded to your local hard drive. Its printing effect can be consistent with the original display. Summary/Notes CAJ is a Chinese academic journal

How to open torrent files How to open torrent files Feb 24, 2024 pm 05:20 PM

Torrent seed files can be opened with software, so what software can be used to open them? Users need to open it with download tools such as Thunder, BitComet, qBittorrent, etc., and then download. This introduction to how to open torrent files can tell you the specific content. The following is a detailed introduction, take a look! How to open a torrent seed file? Answer: Use Thunder, BitComet, qBittorrent and other download tools to open it. Detailed introduction: 1. Torrent is a BT seed file that can be opened with various download software. 2. The more people download this software, the faster the download speed will be. 3. In order to ensure accuracy, the software will calculate Ha every time it downloads a block.

Slack: This link cannot be opened Slack: This link cannot be opened Feb 19, 2024 pm 09:20 PM

We don't want users to get confused when Sack can't open a link. In this article, we will explore ways to solve this problem. If you encounter a similar situation, check out the solutions provided in this article to quickly resolve the issue. Why isn't my Slack working? If Slack isn't running properly, there are some common factors you may want to check. First check the internet connection as the application requires a stable network. Next, check to see if cache and cookies are corrupted, then check the status of the Slack server to clear any firewall or antivirus programs that may be interfering. Users can also try resetting the app or doing a clean installation. Fix We can't open this link in Slack error If you can't open this link in Slack

Where can I open the Douyin mini game? Two ways to open Douyin mini games Where can I open the Douyin mini game? Two ways to open Douyin mini games Mar 15, 2024 am 09:30 AM

Douyin is a popular short video social application. Users can not only watch and share various types of short video content, but also provide a series of mini games for you to play. So where can I get into Douyin mini-games? Where is the entrance to Douyin mini game? Let’s take a look at the detailed tutorial below. Method 1: Open the mini program 1. Click the My option. After entering the homepage of Douyin, click the My option to enter. 2. Click the three horizontal lines. After entering the My interface, click the three horizontal lines button above. 3. Click on the mini program. After opening the three horizontal lines option, click on the mini program inside. 4. Click on the Douyin Mini Game. After entering the mini program interface, click on the Douyin Mini Game option to open it. Method 2: Search and open 1. Click the magnifying glass to enter

See all articles