Открытие новых вкладок скриптом

Появилась необходимость сделать открытие дополнительной вкладки в браузере без желания на то пользователя.

Технически сделать это можно, но только браузеры не разрешат открыться вкладке, если действие не вызвано пользователем.

Вот такая всплывет ошибка в Firefox, и аналогичное предупреждение покажет Chrome, да и все остальные браузеры:

Вот, что по этому поводу пишется на learn.javascript.ru:

Рекламные попапы очень надоели посетителям, аж со времён 20-го века, поэтому современные браузеры всплывающие окна обычно блокируют. При этом пользователь, конечно, может изменить настройки блокирования для конкретного сайта.

Всплывающее окно блокируется в том случае, если вызов window.open произошёл не в результате действия посетителя.

Как же браузер понимает – посетитель вызвал открытие окна или нет?

Для этого при работе скрипта он хранит внутренний «флаг», который говорит – инициировал посетитель выполнение или нет. Например, при клике на кнопку весь код, который выполнится в результате, включая вложенные вызовы, будет иметь флаг «инициировано посетителем» и попапы при этом разрешены.

А если код был на странице и выполнился автоматически при её загрузке – у него этого флага не будет. Попапы будут заблокированы.

Все равно примеры рассмотрим, а вот применять их или нет, это уже решать вам.

Подключаем jQuery для всех примеров

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

Вариант 1

Через 2 секунды откроется вторая вкладка

$(window).load(function(){
  setTimeout( function() {
    window.open("index2.html");
  }, 2000);
});

Вариант 2

При первом нажатии на любом месте страницы открывается 2 окна

window.flag = 0;

$(document).on('click', function() {
  if ( window.flag == 0 ) {
    window.open('index2.html');
    window.open('index3.html');
    
    window.flag = 1;
  }
});

Вариант 3

При нажатии на кнопку откроется 2 вкладки

<a class="myBtn" href="#">Button</a>
$(".myBtn").on('click', function() {
  window.open('index2.html');
  window.open('index3.html');
  return false;
});

Вариант 4 (Аналогичный Варианту 3)

При нажатии на кнопку откроется 2 вкладки

<a class="myBtn" href="#">Button</a>
$(".myBtn").on('click', function(e) {
  e.preventDefault();
  window.open('index2.html');
  window.open('index3.html');
});

Вариант 5

Ложный клик по кнопке — делаем вид, как-будто пользователь кликнул по кнопке .myBtn через 2 сек, но браузер не дурак, и все равно заблокирует всплывающее окно.

<a class="myBtn" href="site.ua">Button</a>
$(window).load(function(){
  setTimeout( function() {
    $('.myBtn')[0].click();
  }, 2000);
});
Виджеты заблокированных в Украине ресурсов (ВКонтакте, mail.ru, Яндекс и др.) могут навредить сайтам?

Рекомендую удалить все виджеты Яндекса и вКонтакте со своих сайтов из-за блокировки оных интернет-провайдерами в…

Gulp — подробное руководство

[vc_message color=»alert-info»]Данная статья подходит только для GULP версии 3. В самом низу есть пример моего…

Содержимое файла gulpfile.js

Содержимое файла gulpfile.js для рабочей папки app с билдом в папку dist: Содержимое файла gulpfile.js…

Делаем колонки одинаковой высоты с помощью JS

Есть много способов сделать колонки одинаковой высоты, но самый удобный для меня — с помощью…

Ответить