Подтвердить что ты не робот

Jquery window.open в ajax успех заблокирован

Попытка открыть новое окно браузера в моем вызове с вызовом ajax, однако, он заблокирован как всплывающее окно. Я сделал несколько поисков и обнаружил, что пользовательское событие должно быть привязано к окну .open, чтобы этого не произошло.

Я также нашел это решение, в котором вы открываете пустое окно перед ajax, затем загружаете URL-адрес, как обычно, в вызов успеха.

Итак, у меня есть два вопроса:

1 - Это единственное решение, потому что я бы предпочел не открывать это пустое окно.

2 - Если это действительно единственный способ, то как я могу добавить load html в это новое окно? Например, если мой аякс не удался, как я могу добавить текст ошибки в это пустое окно, так как URL-адрес не будет открыт?

Я также должен отметить, что я не хочу, чтобы вызов ajax был синхронным... это побеждает цель ajax, и я считаю, что это будет устаревать, если не будет... исправьте меня, если я буду неправильно читать поиск.

    $('#user-login').on('click', function () {
        var $form = $(this).closest('form');
        window.open('about:blank', 'myNewPage');

        $.ajax({
            type: 'post',
            url: '/spc_admin/process/p_user_login.php',
            data: $form.serialize(),
            dataType : 'json'
        }).done(function (response) {

            $myElem = $('#user_login_message'); //performance for not checking dom
            $myElem.fadeOut('fast', function(){

                if (response.success)
                {
                    $myElem.html('<p><b class="text-blue">Success!</b> &nbsp;You have been logged in as \'<b>'+response.username+'</b>\' in a new browser window.</p>').fadeIn('fast');                 

                    // open new window as logged in user
                    //window.open('http://www.example.com/');
                    window.open('http://www.example.com/', 'myNewPage');
                } 
                else
                {
                    $myElem.html('<p><b class="text-red">Error!</b> &nbsp;Please select a valid user from the dropdown list.</p>').fadeIn('fast');
                }               
            });
        });
    });

EDIT:

Для всех, кого это интересует... вот решение, которое я придумал. Для нового окна требуется имя, чтобы в одном окне открывались последовательные клики и не открывались новые. Добавление html немного отличается от заданного в ответе, и это работает. Размытие окна не работает, так что его нет. Из того, что я мог обнаружить, это не контролируемо и является браузером.

    $('#user-login').on('click', function () {
        var $form = $(this).closest('form');

        //open blank window onclick to prevent popup blocker
        var loginWindow = window.open('', 'UserLogin');

        $.ajax({
            type: 'post',
            url: '/spc_admin/process/p_user_login.php',
            data: $form.serialize(),
            dataType : 'json'
        }).done(function (response) {

            $myElem = $('#user_login_message'); //performance for not checking dom
            $myElem.fadeOut('fast', function(){

                if (response.success)
                {
                    // show success
                    $myElem.html('<p><b class="text-blue">Success!</b> &nbsp;You have been logged in as \'<b>'+response.username+'</b>\' in a new browser window.</p>').fadeIn('fast');                 

                    // open new window as logged in user
                    loginWindow.location.href = 'http://www.example.com/';
                } 
                else
                {
                    // show error
                    $myElem.html('<p><b class="text-red">Error!</b> &nbsp;Please select a valid user from the dropdown list.</p>').fadeIn('fast');

                    // add error to the new window (change this to load error page)
                    loginWindow.document.body.innerHTML = '<p><b>Error!</b> &nbsp;Please select a valid user from the dropdown list.</p>';
                }               
            });
        });
4b9b3361

Ответ 1

Чтобы открыть новый URL-адрес в открывшемся окне в onclick, выполните следующие

  • Сохраните новое окно, которое вы создали в переменной var newWindow = window.open("","_blank");
  • Измените местоположение нового окна newWindow.location.href = newURL;

Еще одна вещь, которая может быть улучшена для пользователей: отправить новое окно в фоновый режим сразу (newWindow.blur) после открытия, а затем снова вернуть его на передний план (newWindow.focus), открыв URL-адрес в новом окне.

Ответ 2

Сделайте a window.open("about:blank", "newPage"); перед вызовом AJAX, а затем после вызова добавьте URL-адрес в открытое окно, вызвав window.open("http://google.com", "newPage");.